Ext.ux.form.SearchField 扩展

 

Ext.ux.form.SearchField 本身并非Ext的原生组件（你在Ext的api中找不到它的），它本身就是后来的封装产物，而它似乎并未提供继续扩展的接口，那么有没有办法来扩展它呢？

 

基础知识：

一般地，我们如下使用searchField：

        toolbar.add('->',{
        	xtype: 'searchfield',
        	store: this.grid.store,
			//width: 400,
			fieldLabel: '搜索',
			labelWidth: 30,
			align: 'right',
        });

 其中store项，是我们要传入的目标store，一般为一个grid的store.

 

问题背景：

如下图所示，现在我期望在点击搜索按钮时可以连带前面的“信息类型”值一并进行查询。

 

扩展思路：

下面有两个思路，我是采用思路2来实现的。

思路1：显然的，直接修改Ext.ux.form.SearchField源码可以达到扩展目的，但是这样做可能会影响通用性，而且需要阅读其源码；

思路2：在“信息类型”选择改变的时候（change事件中），获取目标store并绑定额外参数值即可，这样SearchField控件在查询的时候只管重新加载目标store，自然可以把我绑定的参数一并带过去了。附：“信息类型”触发change事件时，调用如下函数进行绑定：

    onChange: function(combo, newValue, oldValue, eOpts){
    	var store = Ext.getCmp('info-grid').getStore();
    	store.getProxy().extraParams.infoType = newValue;
    	store.reload();
    },