javascript Ext JS:过滤组合框的正确技术?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7333212/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Ext JS: Proper technique to filter a combobox?
提问by Upperstage
When I filter a combobox by adding a filter to the underlying store, sometimes the filter works (items are removed) and sometimes it has no effect. I have debugged the filterBy function; it is being called and is returning true/false as I wish to filter/show items.
当我通过向底层存储添加过滤器来过滤组合框时,过滤器有时起作用(项目被删除),有时不起作用。我已经调试了 filterBy 函数;它正在被调用并返回真/假,因为我希望过滤/显示项目。
I read on the ExtJS forums that the, "Combobox uses filtering (even with triggerAction:'all'), so your own trigger gets replaced by the one from the combobox." Two filters?
我在 ExtJS 论坛上读到,“组合框使用过滤(即使使用 triggerAction:'all'),因此您自己的触发器会被组合框中的触发器替换。” 两个过滤器?
What is the proper technique to remove temporarily items in an Ext JS combobox?
在 Ext JS 组合框中临时删除项目的正确技术是什么?
采纳答案by martyglaubitz
You'll need to delete the property 'lastQuery' of the Combobox, everytime you filter the Store. This is where the ComboBox caches it's Entryset after it build it up the first time.
每次过滤商店时,您都需要删除组合框的属性“lastQuery”。这是 ComboBox 在第一次构建后缓存它的 Entryset 的地方。
So doing something like this:
所以做这样的事情:
'window combobox[name=countryselection]' : {
'change' : function(view, newValue){
with(Ext.data.StoreManager.lookup('Subcountries')){
var combobox = Ext.getCmp('MainWindow').query('combobox[name=subcountryselection]')[0];
//force the combobox the rebuild its entryset
delete combobox.lastQuery;
clearFilter();
filter('countryId', newValue);
}
}
}
It works great for me :-)
这对我很有效 :-)
回答by adept07
Use lastQuery: '' in the config.
在配置中使用 lastQuery: '' 。
I faced a similar issue where the combo box would show all the items when the trigger is clicked the first time, irrespective of the filter.
我遇到了一个类似的问题,即第一次单击触发器时,组合框会显示所有项目,而不管过滤器如何。
To make sure the filter in the store is not cleared the first time the ComboBox trigger is used, configure the combo with lastQuery='' http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.form.field.ComboBox-property-lastQuery
为确保首次使用 ComboBox 触发器时不会清除商店中的过滤器,请使用 lastQuery='' http://docs.sencha.com/extjs/4.2.1/#!/api/Ext配置组合 .form.field.ComboBox-property-lastQuery
回答by Imad Moqaddem
You want to understand how to reproduce the behaviour of triggerAction:'all', so why not diving into the code ?
您想了解如何重现 triggerAction:'all' 的行为,那么为什么不深入研究代码呢?
Here the source code of the Class ComboBox : http://docs.sencha.com/ext-js/4-0/source/ComboBox.html#Ext-form-field-ComboBox-cfg-triggerAction
这里是类 ComboBox 的源代码:http: //docs.sencha.com/ext-js/4-0/source/ComboBox.html#Ext-form-field-ComboBox-cfg-triggerAction
If you look at the code, you'll see that:
如果你看一下代码,你会看到:
1) When trigger is clicked, method doQuery is called.
1) 当触发器被点击时,方法 doQuery 被调用。
onTriggerClick: function() {
var me = this;
if (!me.readOnly && !me.disabled) {
if (me.isExpanded) {
me.collapse();
} else {
me.onFocus({});
if (me.triggerAction === 'all') {
me.doQuery(me.allQuery, true);
} else {
me.doQuery(me.getRawValue(), false, true);
}
}
me.inputEl.focus();
}
},
2) In method doQuery, the interesting piece of code is:
2) 在 doQuery 方法中,有趣的一段代码是:
if (isLocalMode) {
// forceAll means no filtering - show whole dataset.
if (forceAll) {
store.clearFilter();
} else {
// Clear filter, but supress event so that the BoundList is not immediately updated.
store.clearFilter(true);
store.filter(me.displayField, queryString);
}
}
3) We can see that the method filter of the Store is called. You have your answer, the proper technique to remove temporarily items in an ExtJS combobox (in a store generally), is using the method filter on the store.
3)我们可以看到调用了Store的方法filter。你有你的答案,在 ExtJS 组合框中(通常在商店中)临时删除项目的正确技术是使用商店上的方法过滤器。
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.Store-method-filter
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.Store-method-filter
Remember, Your best friend is always documentation! http://docs.sencha.com/ext-js/4-0/#
请记住,您最好的朋友永远是文档! http://docs.sencha.com/ext-js/4-0/#
回答by dmackerman
Keep in mind that filtering does not "recreate" the store with the new data, such that if you filtered a combo with the following values for "apple"
:
请记住,过滤不会使用新数据“重新创建”存储,因此如果您使用以下值过滤组合"apple"
:
orange
banana
apple
And you clicked on the trigger, "apple" would be shown. However, if you started typing (and have typeAhead: true
active, the filtering based on your input will default back to the orange/banana/apple
Store.
然后您点击触发器,将显示“苹果”。但是,如果您开始输入(并且typeAhead: true
处于活动状态),则基于您输入的过滤将默认返回orange/banana/apple
Store。