關於 Ext.form.ComboBox的模糊過濾
Ext.form.ComboBox的過濾方式有點兒和傳統的不一樣，不一樣的地方就是，如果你輸入“test”，而下拉框裏有一個值也爲“test”，傳統的做法就是下拉框裏的test值就不會出現了，而Ext.form.ComboBox的下拉框裏還是顯示“test值”
如圖：
我們可以通過Ext.form.ComboBox的“beforequery”事件來過濾掉這個“test”值
js代碼如下：
注：只需看beforequery事件的處理函數即可
<script type="text/javascript">
Ext.onReady(function(){
var arr=[["aaa",1],["bbb",2],["ccc",3],["test",3]];
var store = new Ext.data.SimpleStore({
autoLoad:true,
data:arr,
fields:["name","value"]
});
var combox=new Ext.form.ComboBox({
applyTo:"test",
store: store,
displayField :'name',
mode: 'local',
hideTrigger :true,
lastQuery:'',
triggerAction:'query',
width :120
});
combox.getEl().on("mousedown",function(){
combox.onTriggerClick();
});
combox.on('beforequery',function(qe){
var combo = qe.combo;
//輸入框的值
var q = qe.query;
forceAll = qe.forceAll;
if(forceAll === true || (q.length >= combo.minChars)){
if(combo.lastQuery !== q){
combo.lastQuery = q;
if(combo.mode == 'local'){
combo.selectedIndex = -1;
if(forceAll){
combo.store.clearFilter();
}else{
//寫自己的模糊過濾條件
combo.store.filterBy(function(record,id){
var text = record.get(combo.displayField);
var val=combo.getValue();
//過濾掉與輸入框的值相等的記錄
if(text==val){
return false;
}
return (text.indexOf(q)!=-1);
});
}
combo.onLoad();
}else{
combo.store.baseParams[combo.queryParam] = q;
combo.store.load({
params: combo.getParams(q)
});
combo.expand();
}
}else{
combo.selectedIndex = -1;
combo.onLoad();
}
}
return false;
});
});
</script>