0

我所拥有的是一个获取 ID 列表的下拉列表，其选择决定了应该为第二个下拉列表获取哪个列表。问题是，除非我先单击（空）第二个下拉列表，否则在第一个下拉列表中选择一个选项后它不会填充。但是，一旦执行此“解决方法”，无论何时在第一个下拉列表中选择一个选项，第二个下拉列表总是会正确填充，这是预期的功能（除了最初的怪异）。

抱歉，如果这令人困惑，这是我的代码：

var restaurantInput =
  {
      createInput: function(parentObject, inputClassName, value, propertyObject)
      {
          var restaurantList = [];
          $.ajax({
              type: "GET",
              url: "http://mysite.com/restaurants/",
              success: function(response)
              {
                  var results = (typeof response === 'string' ) ? JSON.parse(response) : response;
                  for (i in results.restaurants){
                      restaurantList.push({restaurantID: results.restaurants[i].restaurant_id.toString(), restaurantname: results.restaurants[i].name});
                  }
              }
          }).done(function(){
              var restaurantCombo = Ext.create("Ext.form.field.ComboBox",
              {
                  store:
                  {
                    filterOnLoad: false,
                    sortOnLoad: false,
                    fields: ["restaurantID", "restaurantname"],
                    data: restaurantList
                  },
                  name: "restaurantName",
                  id: "restaurantName",
                  displayField: "restaurantname",
                  valueField: "restaurantID",
                  listeners: {
                      'select':function(){
                          updateMenuList(Ext.getCmp("restaurantName").getValue());
                      }
                  }
              });
              var str = '<div id="restaurantComboDiv"></div>';
              parentObject.html(str);
              restaurantCombo.setValue(value);
              restaurantCombo.render("restaurantComboDiv");
          });
      }
  };

var menuCombo = Ext.create("Ext.form.field.ComboBox",
  {
      store:
      {
        filterOnLoad: false,
        sortOnLoad: false,
        fields: ["menuID", "menuname"],
        data: []
      },
      name: "menuName",
      id: "menuName",
      displayField: "menuname",
      valueField: "menuID",
      multiSelect: true
  });

var menuInput =
  {
      createInput: function(parentObject, inputClassName, value, propertyObject)
      {
      var str = '<div id="menuComboDiv"></div>';
      parentObject.html(str);
      menuCombo.setValue(value);
      menuCombo.render("menuComboDiv");
      }
  };

function updateMenuList(RID)
  {
      var menuList = [];
      $.ajax({
              type: "GET",
              url: "http://mysite.com/restaurants/"+RID,
              success: function(response)
              {
                  var results = (typeof response === 'string' ) ? JSON.parse(response) : response;
                  var i=0, len=0;
                  for (i=0, len=results.menu.length; i<len; i++)
                  {
                    menuList.push({menuID: results.menu[i].menu_id, menuname: results.menu[i].name});
                  }
              }
          }).done(function(){
              menuCombo.setValue("");
              menuCombo.store.removeAll();
              menuCombo.store.add(menuList);
              menuCombo.bindStore(menuCombo.store);
          });
  }

当页面首次加载时，用户可以从餐厅列表中进行选择。当做出选择时，会触发一个事件，该事件应该更新菜单的存储。然后用户尝试选择他们的订单，但菜单是空白的。如果用户选择另一家餐厅，则菜单会正确填充。每隔一段时间，用户选择任何餐厅，菜单就会继续填充。

如果用户的第一个选择是打开菜单，它显然是空白的，因为尚未选择餐厅。如果用户随后选择了一家餐厅，则菜单会正确填充。

我试图通过调用menuCombo.expand();更新函数来解决这个问题.done()，它有点工作。这会导致菜单在选择餐厅后立即展开，并且正确的项目都在那里。但是，一旦 Menu 因任何原因崩溃，再次展开时它会变为空白，这与之前的问题完全相同。

4

1 回答 1

3

找到了我的问题的答案（与您的问题完全相同），将 queryMode 设置为本地...

comboBox.queryMode = '本地';

（参考：与 Ext.data.JsonStore 连接的 ExtJS 3 Combobox 在第二次++ click 时未打开）

希望这可以帮助！

于 2013-04-23T18:51:54.657 回答