解决 Ext3.x 中 ComboboxTree 展开树时panel被关闭的bug
2011-07-13 14:12
323 查看
解决办法, 把ComboboxTree.js代码换成下面的:
Ext.form.ComboBoxTree = Ext.extend(Ext.form.ComboBox, {
store: new Ext.data.SimpleStore({ fields: [], data: [[]] }),
editable: false,
shadow: false,
mode: 'local',
triggerAction: 'all',
selectedClass: '',
onSelect: null,
canCollapse: true,
constructor: function(_cfg) {
if (_cfg == null) {
_cfg = {};
}
Ext.apply(this, _cfg);
this.treerenderid = Ext.id();
this.tpl = String.format('<tpl for="."><div style="height:200px"><div id="ext-combobox-tree{0}"></div></div></tpl>', this.treerenderid);
Ext.form.ComboBoxTree.superclass.constructor.apply(this, arguments);
if (this.tree) {
var cmb = this;
this.tree.on('click', function(node) {
cmb.canCollapse = true;
if (Ext.isFunction(cmb.onSelect)) {
cmb.onSelect(cmb, node);
} else {
cmb.setValue(node.text);
if (cmb.hiddenField) {
cmb.hiddenField.value = node.id;
}
}
cmb.collapse();
});
//以下事件,让combobox能正常关闭
this.tree.on('expandnode', function() { cmb.canCollapse = true; });
this.tree.on('beforeload', function() { cmb.canCollapse = false; });
this.tree.on('beforeexpandnode', function() { cmb.canCollapse = false; });
this.tree.on('beforecollapsenode', function() { cmb.canCollapse = false; });
}
this.on('expand', this.expandHandler, this);
this.on('collapse', this.collapseHandler, this);
},
expandHandler: function expand() {
this.canCollapse = true;
if (this.tree) {
this.tree.render('ext-combobox-tree' + this.treerenderid);
this.canCollapse = true;
this.tree.getRootNode().expand();
}
},
collapseHandler: function collapse() {
if (!this.canCollapse) {
this.expand();
}
}
});
Ext.reg('combotree', Ext.form.ComboBoxTree);
调用代码:
new Ext.form.ComboBoxTree({
id: 'mytree',
hiddenName:'dept_no',
fieldLabel:'机构',
tree: new Ext.tree.TreePanel({
root: new Ext.tree.AsyncTreeNode({ text: '--选择--', id: '0' }),
rootVisible: false,
border: false,
dataUrl: '/AreaList.aspx',
listeners: {
beforeload: function(n) { if (n) { this.getLoader().baseParams.id = n.attributes.id; } }
}
})/*,
onSelect: function(cmb, node) {
alert(node.attributes.text);
}*/
})
Ext.form.ComboBoxTree = Ext.extend(Ext.form.ComboBox, {
store: new Ext.data.SimpleStore({ fields: [], data: [[]] }),
editable: false,
shadow: false,
mode: 'local',
triggerAction: 'all',
selectedClass: '',
onSelect: null,
canCollapse: true,
constructor: function(_cfg) {
if (_cfg == null) {
_cfg = {};
}
Ext.apply(this, _cfg);
this.treerenderid = Ext.id();
this.tpl = String.format('<tpl for="."><div style="height:200px"><div id="ext-combobox-tree{0}"></div></div></tpl>', this.treerenderid);
Ext.form.ComboBoxTree.superclass.constructor.apply(this, arguments);
if (this.tree) {
var cmb = this;
this.tree.on('click', function(node) {
cmb.canCollapse = true;
if (Ext.isFunction(cmb.onSelect)) {
cmb.onSelect(cmb, node);
} else {
cmb.setValue(node.text);
if (cmb.hiddenField) {
cmb.hiddenField.value = node.id;
}
}
cmb.collapse();
});
//以下事件,让combobox能正常关闭
this.tree.on('expandnode', function() { cmb.canCollapse = true; });
this.tree.on('beforeload', function() { cmb.canCollapse = false; });
this.tree.on('beforeexpandnode', function() { cmb.canCollapse = false; });
this.tree.on('beforecollapsenode', function() { cmb.canCollapse = false; });
}
this.on('expand', this.expandHandler, this);
this.on('collapse', this.collapseHandler, this);
},
expandHandler: function expand() {
this.canCollapse = true;
if (this.tree) {
this.tree.render('ext-combobox-tree' + this.treerenderid);
this.canCollapse = true;
this.tree.getRootNode().expand();
}
},
collapseHandler: function collapse() {
if (!this.canCollapse) {
this.expand();
}
}
});
Ext.reg('combotree', Ext.form.ComboBoxTree);
调用代码:
new Ext.form.ComboBoxTree({
id: 'mytree',
hiddenName:'dept_no',
fieldLabel:'机构',
tree: new Ext.tree.TreePanel({
root: new Ext.tree.AsyncTreeNode({ text: '--选择--', id: '0' }),
rootVisible: false,
border: false,
dataUrl: '/AreaList.aspx',
listeners: {
beforeload: function(n) { if (n) { this.getLoader().baseParams.id = n.attributes.id; } }
}
})/*,
onSelect: function(cmb, node) {
alert(node.attributes.text);
}*/
})
相关文章推荐
- 解决 Ext3.x 中 ComboboxTree 展开树时panel被关闭的bug
- [老贴重发]EXT:指定树控件TreePanel 展开到第几层
- 导航面板[ExtJS4]ExtJS4左边菜单面板收缩展开,右边TabPanel内容动态更新(解决宽度不能自适应问题)
- ExtJs TreePanel 不能加载ashx数据的解决办法
- extjs treepanel checkbox得到所选的参数,浏览器不兼容的解决办法
- ExtJs TreePanel使用TreeLoader在IE下无法正常加载显示的解决方法
- Ext TreePanel accordion布局中放置TreePanel不显示横向滚动条的解决办法。
- 关于 ExtAspNet 控件 Tree 嵌套在 Region Panel 内 OnNodeCommand 无响应的问题解决方法
- 解决ExtJS TreePanel 的 iconCls设置问题
- extjs4 treepanel checkbox 复选框 全选完美解决
- Ext gridPanel宽度100%时width:10000 BUG解决
- Asp.net UpdatePanel在asyncpostback后页面标题丢失的BUG解决
- ExtJs TreePanel使用TreeLoader在IE下无法正常加载显示的解决方法
- ScrollView嵌套ListView时Bug解决以及ExpandableListView设置全部展开
- 解决Ext.TreePanel在IE下不能正常加载问题
- 对 COMBOBOX 的外科手术:解决 COMBOBOX 处理回退键的 BUG
- .NET控件ComboBox绑定数据源的一个Bug及解决方法
- Extjs6 treepanel store无法加载请求后台URL数据bug
- delphi TreeComboBox 解决树的单击事件和小三角单击事件冲突问题
- Extjs6 treepanel 自动靠右bug