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();
    },