首页 > extjs2.0 ie8 下拉树_extjs自定义下拉树

extjs2.0 ie8 下拉树_extjs自定义下拉树

//创建treeCombox.js

Ext.define('Redm.commons.TreeCombox', {

extend : 'Ext.form.field.Picker',

xtype : 'treecombox',

triggerCls : Ext.baseCSSPrefix + 'form-arrow-trigger',

config : {

displayField : null,

columns : null,

rootVisible : false,

selectOnTab : true,

firstSelected : false,

maxPickerWidth : 200,

maxPickerHeight : 360,

minPickerHeight : 50

},

editable : false,

initComponent : function() {

var me = this;

me.callParent(arguments);

this.addEvents('select');

me.store.on('load', me.onLoad, me);

},

createPicker : function() {

var me = this, picker = Ext.create('Ext.tree.Panel', {

id : 'treePicker',

store : me.store,

floating : true,

hidden : true,

width : me.maxPickerWidth,

displayField : me.displayField,

columns : me.columns,

maxHeight : me.maxTreeHeight,

shadow : false,

rootVisible : me.rootVisible,

manageHeight : false,

listeners : {

itemclick : Ext.bind(me.onItemClick, me)

},

viewConfig : {

listeners : {

render : function(view) {

view.getEl().on('keypress', me.onPickerKeypress, me);

}

}

}

}), view = picker.getView();

view.on('render', me.setPickerViewStyles, me);

if (Ext.isIE9 && Ext.isStrict) {

view.on('highlightitem', me.repaintPickerView, me);

view.on('unhighlightitem', me.repaintPickerView, me);

view.on('afteritemexpand', me.repaintPickerView, me);

view.on('afteritemcollapse', me.repaintPickerView, me);

}

return picker;

},

setPickerViewStyles : function(view) {

view.getEl().setStyle({

'min-height' : this.minPickerHeight + 'px',

'max-height' : this.maxPickerHeight + 'px'

});

},

repaintPickerView : function() {

var style = this.picker.getView().getEl().dom.style;

style.display = style.display;

},

alignPicker : function() {

var me = this, picker;

if (me.isExpanded) {

picker = me.getPicker();

if (me.matchFieldWidth) {

picker.setWidth(this.picker.getWidth());

}

if (picker.isFloating()) {

me.doAlign();

}

}

},

onItemClick : function(view, record, node, rowIndex, e) {

this.selectItem(record);

},

onPickerKeypress : function(e, el) {

var key = e.getKey();

if (key === e.ENTER || (key === e.TAB && this.selectOnTab)) {

this.selectItem(this.picker.getSelectionModel().getSelection()[0]);

}

},

selectItem : function(record) {

var me = this;

me.setValue(record.get(this.valueField));

me.picker.hide();

me.inputEl.focus();

me.fireEvent('select', me, record);

me.collapse();

},

onExpand : function() {

var me = this, picker = me.picker, store = picker.store, value = me.value;

if (value) {

var node = this.picker.getSelectionModel().getSelection()[0];

if (node)

picker.selectPath(node.getPath());

} else {

var hasOwnProp = me.store.hasOwnProperty('getRootNode');

if (hasOwnProp)

picker.getSelectionModel().select(store.getRootNode());

}

Ext.defer(function() {

picker.getView().focus();

}, 1);

// 全展开

picker.expandAll();

},

setValue : function(value) {

var me = this, record;

me.value = value;

if (me.store.loading) {

return me;

}

try {

var hasOwnProp = me.store.hasOwnProperty('getRootNode');

var recordStore = this.picker.getSelectionModel().getSelection()[0];

record = value ? recordStore : (hasOwnProp ? me.store.getRootNode() : null);

me.setRawValue(record ? record.get(this.displayField) : '');

} catch (e) {

me.setRawValue('');

}

return me;

},

getValue : function() {

return this.value;

},

onLoad : function(store, node, records) {

if (this.firstSelected) {

if (records && records.length > 0) {

var record = records[0];

this.setValue(record.get(this.valueField));

this.setRawValue(record.get(this.displayField));

}

}

//var value = this.value;

console.log(value);

//if (value) {

//this.setValue(value);

//} else {

//if (this.firstSelected) {

//if (records && records.length > 0) {

//var record = records[0];

//this.setValue(record.get(this.valueField));

//this.setRawValue(record.get(this.displayField));

//}

//}

//}

},

getSubmitData : function() {

var me = this, data = null;

if (!me.disabled && me.submitValue) {

data = {};

data[me.getName()] = '' + me.getValue();

}

return data;

},

onTriggerClick : function() {

var me = this;

// me.store.load();

if (!me.readOnly && !me.disabled) {

if (me.isExpanded) {

me.collapse();

} else {

me.expand();

}

me.inputEl.focus();

}

}

});

更多相关: