ExtJs ComBox下拉树 从网上例子改造而成
定义:
Ext.define('TeaComboTreeBox', {
extend: 'Ext.form.field.ComboBox',
multiSelect: false, //控制单选,多选
fieldLabel: '教师',
labelWidth: 35,
emptyText: '全部',
displayField: 'text',
valueField: 'id',
createPicker: function () {
var me = this;
var store = Ext.create('Ext.data.TreeStore', {
proxy: {
type: 'ajax',
url: 'UserTree.aspx'
},
root: {
text: '教师',
id: 'AE7613CF-6F6A-4D2C-82EA-32C1D640C23B',
expanded: true
},
folderSort: false
});
var picker = Ext.create('Ext.tree.Panel', {
store: store,
rootVisible: false,
selModel: {
mode: me.multiSelect ? 'SIMPLE' : 'SINGLE'
},
floating: true,
hidden: true,
focusOnToFront: false
});
me.mon(picker, {
itemclick: me.onItemClick,
refresh: me.onListRefresh,
scope: me
});
me.mon(picker.getSelectionModel(), {
beforeselect: me.onBeforeSelect,
beforedeselect: me.onBeforeDeselect,
selectionchange: me.onListSelectionChange,
scope: me
});
this.picker = picker;
return picker;
}
});
Ext.create('TeaComboTreeBox', { id: 'teacombox' })
其中
UserTree.aspx 返回树结构的JSON数据