ExtJS 4 Grid Filtering issue: no searching icon in StringFilter
You can see this issue in this example: http://docs.sencha.com/ext-js/4-0/#!/example/grid-filtering/grid-filter-local.html
Try to filter "Company" column, and you will not see any icon near text field.
I got some source code from RangeMenu (my idea was the principle of working NumberFilter) to fix this issue (please replace all "Ext4" to "Ext"):
PHP Code:
init : function (config) {
Ext4.applyIf(config, {
enableKeyEvents : true,
hideLabel : false,
fieldLabel : this.getIconTpl().apply({
cls : this.iconCls || 'no-icon',
text : this.emptyText || '',
src : Ext4.BLANK_IMAGE_URL
}),
labelSeparator : '',
labelWidth : 29,
listeners : {
scope : this,
keyup : this.onInputKeyUp,
el : {
click : function (e) {
e.stopPropagation();
}
}
}
});
this.inputItem = Ext4.create('Ext4.form.field.Text', config);
this.menu.add(this.inputItem);
this.updateTask = Ext4.create('Ext4.util.DelayedTask', this.fireUpdate, this);
},
/**
* Возвращает шаблон иконки
* @return {Ext4.XTemplate}
*/
getIconTpl : function () {
return Ext4.create('Ext4.XTemplate',
'<img src="{src}" alt="{text}" class="' + Ext4.baseCSSPrefix + 'menu-item-icon ux-rangemenu-icon {cls}" />'
);
},
Example code has iconCls defined which is not displayed
In Ext4 Examples code, Local Grid filter has iconCls defined in StringFilter.
But, textField config doesnt have such config, so it is not displayed at all.
Need to provide an alternative to display this icon. If not the separation line behind the textfield is not looking good. You can see this in the examples provided with latest version too.
guyfawkes,
Even your code doesnt display that. I tried it with Ext 4.1.1.
Thanks,
Sriram
Find icon displayed after some trials.. :)
It worked using below code in StringFilter.js:
Ext.applyIf(config, {
enableKeyEvents: true,
labelCls: 'ux-rangemenu-icon '+this.iconCls,
hideEmptyLabel: false,
labelSeparator: '',
labelWidth: 29,
...
});
Thanks,
Sriram