ExtJs：在组合框中搜索/筛选

我在ExtJs 2.3中遇到了以下问题：

我想在组合框中进行搜索。 我给你举个例子：

Ext.comboData.names = [['Peter', 'Paul', 'Amanda']];

var store = new Ext.data.SimpleStore({
     fields: ['name'],
     data: Ext.comboData.names
});


var combo = new Ext.form.ComboBox({
     name: '...',
     id: '...',
     store: store,
     displayField: 'name',
     typeAhead: true,
     mode: 'local',
     forceSelection: false,
     triggerAction: 'all',
     emptyText: '-',
     selectOnFocus: true,
     applyTo: '...',
     hiddenName: '...', 
     valueField: 'name'
     enableKeyEvents: true,
     lastQuery: '',
     listeners: {
         'keyup': function() {
               this.store.filter('name', this.getRawValue(), true, false);
         }
     }
});

当我输入“a”时，“下拉列表”中应该只有“保罗”和“阿曼达”。因此，换句话说，我正在寻找一种解决方案，不仅通过条目的第一个字母过滤数据，而且可能通过使用正则表达式（？）之类的东西（如SQL…如“%a%”）过滤数据……我还需要组合框的“onKeyDown”事件类型，以便过滤我添加的每个字母的结果。 我该怎么做？有什么想法吗

提前很多时间：）

舒尔迪

PS：不幸的是，我必须使用当前版本的ExtJs（2.3），因此，如果在更高版本中有解决问题的方法，我必须寻找其他方法…

有一个

按键事件（和
按键
，和
按键
），您可以用于此目的

还有一个
过滤器
方法，应该适合您的目的。您可以这样使用它（查找包含“a”字符的值）：

第一个参数是记录字段，第二个是要查找的字符串/regexpt，第三个参数意味着过滤器应该匹配字段的任何部分（而不仅仅是值的开头），最后一个值决定大小写敏感度。当然，如果你愿意，你可以把它关掉

所有这些都适用于ExtJS2.3.0。希望这能让你开始。
我以前也遇到过类似的事情。我查看了，它似乎在使用显示名称进行过滤，而没有在filter函数中设置参数。在这种情况下，除了覆盖doQuery或创建新的用户扩展之外，没有简单的解决方案。幸运的是，可以找到一个

我认为这可能适用于Ext2.3，因为我们最近升级了，我似乎丢失了我的文档链接。但这就是我要做的。
这可以通过覆盖combobox的doQuery方法来完成
 只需删除该列表器并覆盖doQuery方法，如下所示

if(combo!=null){
    combo.doQuery = function(q, forceAll){
  q = Ext.isEmpty(q) ? '' : q;
  var qe = {
      query: q,
      forceAll: forceAll,
      combo: this,
      cancel:false
  };
  if(this.fireEvent('beforequery', qe)===false || qe.cancel){
      return false;
  }
  q = qe.query;
  forceAll = qe.forceAll;
  if(forceAll === true || (q.length >= this.minChars)){
      if(this.lastQuery !== q){
          this.lastQuery = q;
          if(this.mode == 'local'){
              this.selectedIndex = -1;
              if(forceAll){
                  this.store.clearFilter();
              }else{
                  this.store.filter(this.displayField, q, true,false); // supply the anyMatch option
                  }
                  this.onLoad();
              }else{
                  this.store.baseParams[this.queryParam] = q;
                  this.store.load({
                      params: this.getParams(q)
                  });
                  this.expand();
              }
          }else{
              this.selectedIndex = -1;
              this.onLoad();
          }
      }
  };
}

我知道这是一个老问题，但这里的最佳答案建议覆盖
doQuery
。应该避免重写私有方法，尤其是当您要升级时。相反，只需在query

之前添加一个

侦听器，以防止
doQuery
清除过滤器

listeners: {
     'keyup': function() {
           this.store.filter('name', this.getRawValue(), true, false);
     },
     'beforequery': function(queryEvent) {
           queryEvent.combo.onLoad();
           // prevent doQuery from firing and clearing out my filter.
           return false; 
     }
 }

我在ExtJs4中也有类似的要求
检查下面链接中的调整。。。它对我非常有效

anyMatch:true
是您所需要的全部。（像在SQL中…像“%a%”）您所要求的，只需添加以下内容即可完成

示例：

Ext.create('Ext.form.ComboBox', {
  name: 'name',
  anyMatch: true,
  allowBlank: true,
  editable : true,
  typeAhead: true,
  transform: 'stateSelect',
  forceSelection: true,
  queryMode: 'local',
  displayField: 'name',
  valueField: 'id',
  selectOnFocus: true,
  triggerAction: 'all',
  store: {
    fields: ['id', 'name'],
    proxy: {
      type: 'ajax',
      url: '/user'
    },
    autoLoad: true,
    autoSync: true
  }
})

您也可以使用这种方法：
为combobox提供侦听器并捕获此事件：

 change: function() {
                        //debugger
                        var store = this.getStore();
                        store.clearFilter();
                        store.filter({
                            property: 'deviceName',//your property
                            anyMatch: true,
                            value   : this.getValue()
                        });
                    }

您可以使用keyup事件。我没有让它与此一起工作。getValue（）。必须使用这个。getRawValue（）

嘿，非常感谢你的回答！：）我没有在我的组合框中添加侦听器（见上文），但我的问题是，当我键入一些字母时，存储区仍然没有被过滤：（我的代码仍然有问题吗？我不确定
getRawValue（）
是否是在事件期间获取用户输入的正确方法。我建议您使用Firebug调试事件（设置断点），查看要传递到筛选器中的值。还要检查作为参数传递的
EventObject e
。我同意Tommi.Firebug规则。这是我开始研究问题时的做法。为了好玩，请尝试在事件中传递一些额外的参数，并查看您有权访问的内容。有时会出现黄金问题您可以找到的金块。谢谢！非常简洁的解决方案。但我必须添加queryEvent.combo.expand（）在“beforequery”侦听器中使其正常工作。当使用这段代码时，我最终失去了在开始键入搜索时使用箭头键导航组合框的能力。这实际上是自v4.2.1以来的最佳答案！anyMatch:true和queryMode:“local”都是实现示例中所示功能所必需的。
 change: function() {
                        //debugger
                        var store = this.getStore();
                        store.clearFilter();
                        store.filter({
                            property: 'deviceName',//your property
                            anyMatch: true,
                            value   : this.getValue()
                        });
                    }

keyup: {fn:function() {
                        var store1 = ContractStore;//store object
                        store1.clearFilter();
                        store1.filter({
                        property: 'modificationnumber',//your displayField
                        anyMatch: true,
                        value   : this.getRawValue(),
                        exactMatch: false,
                        caseSensitive: false
                    });