Question

如果EXTJS在Xtype的dropDown列表中未在商店中返回，则会解决用户输入值的问题：'combo'。

我需要它保留值，如果它不在商店中，因为我想将其用作电子邮件地址的总搜索字段。

我尝试了forceSelection：false也没有成功。

代码：

     {
                  xtype: 'combo',
                  itemId: 'totalSearchCombo',
                  width: 200,
                  emptyText: 'Total Search',
                  typeAhead: true,
                  editable: true,
                  hideLabel: true,
                  hideTrigger: true,
                  store: 'dropDownList_s',
                  displayField: 'display_name',
                  anchor: '100%',
                  matchFieldWidth: false,
                  listConfig:
                      {
                          width: 195,
                          loadingText: 'Searching...',
                          emptyText: 'No matching items found, or not enough characters entered.',
                          getInnerTpl: function () {
                              var tpl = '<div>{display_name}</div>';
                              return tpl;
                          }
                      },
                  //pageSize: 15,
                  listeners: {
                      //FILTER THE APP LIST IF THE SEARCH FIELD HAS AT LEAST 3 CHARACTERS
                      change: function () {

                         if (Ext.ComponentQuery.query('combobox')[0].getValue().length > 2) {

                             var filterValue = Ext.ComponentQuery.query('combobox')[0].getValue();
                             var s = Ext.data.StoreManager.lookup('dropDownList_s');
                             s.proxy.extraParams.action = 'searchForUser';
                             s.proxy.extraParams.memName = filterValue;
                             s.load();

                         }
                      }
                  }

从商店调用的服务：

 SQL = "SELECT a.member, userNumber, a.member_nm display_name " +
            "FROM dbo.member_grps a " +
            "WHERE member_name like ('%" + memName + "%') ";

StoreModel看起来像：

 Ext.define('App.model.dropDownList_m', {
extend: 'Ext.data.Model',
fields: [
{ name: "member", type: "auto" },
{ name: "userNumber", type: "auto" },
{ name: "display_name", type: "auto" }],
 proxy: {
    type: 'jsonp',
    timeout: 240000,
    url: 'http:// .......',
    extraParams: {
        'action': 'searchForUser',
        'memName': '',
        'userName': ''
    },
    reader: {
        type: 'json',
        root: 'data'
    }
}
});

Answer 1

看起来你正在从change事件中重新加载相应的store。对服务器的远程查询将烘焙到combobox。

您可以在组合框定义中指定queryMode:"remote"，并且不需要监听器。

{
                  xtype: 'combo',
                  itemId: 'totalSearchCombo',
                  width: 200,
                  emptyText: 'Total Search',
                  typeAhead: true,
                  editable: true,
                  hideLabel: true,
                  hideTrigger: true,
                  store: 'dropDownList_s',
                  displayField: 'display_name',
                  anchor: '100%',
                  matchFieldWidth: false,
                  queryMode:'remote',
                  listConfig:
                      {
                          width: 195,
                          loadingText: 'Searching...',
                          emptyText: 'No matching items found, or not enough characters entered.',
                          getInnerTpl: function () {
                              var tpl = '<div>{display_name}</div>';
                              return tpl;
                          }
                      },
                  //pageSize: 15,
                  //listeners: {
                  //    //FILTER THE APP LIST IF THE SEARCH FIELD HAS AT LEAST 3 CHARACTERS
                  //    change: function () {

                  //       if (Ext.ComponentQuery.query('combobox')[0].getValue().length > 2) {

                  //           var filterValue = Ext.ComponentQuery.query('combobox')[0].getValue();
                  //           var s = Ext.data.StoreManager.lookup('dropDownList_s');
                  //           s.proxy.extraParams.action = 'searchForUser';
                  //           s.proxy.extraParams.memName = filterValue;
                  //           s.load();

                  //       }
                  //    }
                  //}

在浏览器的网络标签中查看请求，您会看到请求触发query中指定的参数。设置服务器端代码以从该参数（query）读取。

sencha docs

中提供了更多信息

EXT JS破坏xtype上的输入字段值：'combo'

1 个答案: