Ext.define('Ext.ux.SearchField', {
extend: 'Ext.form.field.Trigger',
alias: 'widget.searchfield',
trigger1Cls: Ext.baseCSSPrefix + 'form-clear-trigger',
trigger2Cls: Ext.baseCSSPrefix + 'form-search-trigger',
hasSearch : false,
paramName : 'query',
initComponent: function() {
var me = this;
me.callParent(arguments);
me.on('specialkey', function(f, e){
if (e.getKey() == e.ENTER) {
me.onTrigger2Click();
}
if (e.getKey() == e.TAB) {
me.onTrigger1Click();
}
});
me.on('blur', function (f) {
var url = me.up('panel').store.proxy.api.read;
if (url.indexOf(me.paramName) > 0)
me.setValue(url.split('=')[1]);
else
me.setValue('');
});
me.on('afterrender', function (f) {
var url = me.up('panel').store.proxy.api.read;
if (url.indexOf(me.paramName) > 0) {
me.setValue(url.split('=')[1]);
me.hasSearch = true;
me.triggerCell.item(0).setDisplayed(true);
me.updateLayout();
}
});
},
afterRender: function(){
this.callParent();
this.triggerCell.item(0).setDisplayed(false);
},
onTrigger1Click : function(){
var me = this,
value = me.getValue(),
store = me.up('panel').store;
if (store.proxy.api.read.indexOf(me.paramName) > 0) {
store.proxy.api.read = store.proxy.api.read.split('?')[0];
store.reload();
}
if (me.hasSearch) {
me.setValue('');
me.hasSearch = false;
me.triggerCell.item(0).setDisplayed(false);
me.updateLayout();
}
},
onTrigger2Click : function(){
var me = this,
value = me.getValue(),
store = me.up('panel').store;
if (value.length > 0) {
if (store.proxy.api.read.indexOf(me.paramName) < 0) {
store.proxy.api.read += '?' + me.paramName + '=' + value;
}
else {
store.proxy.api.read = store.proxy.api.read.split('=')[0] + '=' + value;
}
store.reload();
me.hasSearch = true;
me.triggerCell.item(0).setDisplayed(true);
me.updateLayout();
} else {
if (store.proxy.api.read.indexOf(me.paramName) > 0) {
store.proxy.api.read = store.proxy.api.read.split('?')[0];
store.reload();
}
me.hasSearch = false;
me.triggerCell.item(0).setDisplayed(false);
me.updateLayout();
}
}
});
Extjs 解决MVC中 Ext.ux.SearchField 的问题
最新推荐文章于 2021-02-01 03:25:35 发布