ExtJS使用Roweditor组合无法正常工作

Question

我有ExtJS Grid。我正在使用Roweditor插件与组合框。当我点击网格的任何一行时，我可以看到带更新和取消按钮的编辑器。

现在我面对的问题是当我点击行并且行编辑器被启用时，如果当前显示的值与组合商店匹配，那么它应该显示为选中状态，但它没有显示。如果我使用valueField和displayField的值，那么我可以看到它被选中。

我想我不能发布的图像，所以我在这里给你的代码：

如果我在组合的商店中使用两个valueField和displayField的价值，那么我可以看到所选的值。

editor: { 
    allowBlank: true, 
    selectOnFocus:true, 
    editable:true, 
    xtype:'combobox', 
    valueField:'id', 
    displayField:'status', 
    triggerAction:'all', 
    queryMode: 'local', 
    store:[['NOT_STARTED','NOT_STARTED'], 
      ['IN_PROGRESS','IN_PROGRESS'], 
      ['COMPLETED','COMPLETED'] 
    ], 
    value:0, 
    lazyRender: true 
} 

当我在不同的组合的商店，这是理想的情况下分配displayField和valueField，它没有显示我的选择。

editor: { 
    allowBlank: true, 
    selectOnFocus:true, 
    editable:true, 
    xtype:'combobox', 
    valueField:'id', 
    displayField:'status', 
    triggerAction:'all', 
    queryMode: 'local', 
    store:[['1','NOT_STARTED'], 
      ['2','IN_PROGRESS'], 
      ['3','COMPLETED'] 
    ], 
    value:0, 
    lazyRender: true 
} 

请告诉我这里有什么问题。

---

嗨感谢您的回复，我已按照您的建议进行了更改，但不知何故，它对我无效。这是代码。我的店是

var data = { 
      root: [ 
               { 
                "objectType":"com.yagna.common.domain.Project", 
                "objectId":"3072", 
                "expectedEndDate":"", 
                "startDate":"2011-06-27 13:06:00.0", 
                "name":"Milestone-11", 
                "actualEndDate":"", 
                "id":"4376", 
                "Status":"NOT_STARTED" 
               }] }; 

                        my Column is 

{id: 'Status',width: 20,text: 'Status',dataIndex: 'Status',filter: {type: 'combobox'},sortable: true, groupable: false, 
     editor:{ 
       allowBlank: true, 
       xtype:'combobox', 
       valueField:'field1', 
       displayField:'field2', 
       triggerAction:'all', 
       mode: 'local', 
       store: [['0','NOT_STARTED'],['1','IN_PROGRESS'],['2','COMPLETED']], 
       value:0, 
       lazyRender: true 
      } }, 

                Please suggest what is missing here 

Answer 1

“如果当前显示的值与组合店相匹配，那么 它应该作为选择的表现，但它没有显示出”

的组合框没有按” t值与displayField的值匹配，与valueField的值匹配。

像您一样硬编码的组合框数据存储将自动将第一项（例如'1'）作为valueField，将第二项（例如'NOT_STARTED'）作为displayField。因为没有任何“数字”值（'1'，'2'，'3'）与该列中的值匹配（“NOT_STARTED”，“IN_PROGRESS”，“COMPLETED”），所以它不会向您显示任何东西。

除非我错误地理解了这一点，否则它听起来像网格的数据存储本身包含此“状态”列数据（或任何您称为此列）作为字符串而不是数字（即“NOT_STARTED”，“IN_PROGRESS” ，“完成”而不是1，2，3）。

你可以做两个不同的东西：

最简单的：刚刚离开的值域为字符串不让它一些。

HARDER：如果你真的需要这是一段（未说明）原因号码：

1. 您更改电网数据存储中的数据，使所有数据 此列是数字（1,2,3）而不是字符串。
2. 将renderer配置添加到此列，以便在编辑行而不是时将数字显示为 适当的字符串。
3. 然后，按照您试图将数据存储设置为 [number - string]对象的方式进行操作。另外，如果 你打算这样做，请从商店中的报价中抽出数字。

当然，如果您已经在此列上使用renderer配置，问题可能只是您用引号括起来的数字。

希望这一切都有道理。

编辑：

这里是代码。

首先，把状态元素在一个单独的商店 - 就像这样：

var statusStore = Ext.create('Ext.data.SimpleStore', { 
    fields: ['id', 'status'], 
    data : [ 
     ['0', 'NOT_STARTED'], 
     ['1', 'IN_PROGRESS'], 
     ['2', 'COMPLETED'] 
    ] 
}); 

二，“状态”的值更改为你想要的数字串（“0”）

var data = { 
    root: [{ 
     "objectType":"com.yagna.common.domain.Project", 
     "objectId":"3072", 
     "expectedEndDate":"", 
     "startDate":"2011-06-27 13:06:00.0", 
     "name":"Milestone-11", 
     "actualEndDate":"", 
     "id":"4376", 
     "Status":"0" 
    }] 
}; 

第三，向列配置中添加一个渲染器，并将编辑器中指定的商店更改为我们上面创建的商店（statusStore）。

{ 
    id: 'Status', 
    width: 20, 
    text: 'Status', 
    dataIndex: 'Status', 
    filter: {type: 'combobox'}, 
    sortable: true, 
    groupable: false, 
    // add this renderer 
    renderer: function(value) { 
     var idx = statusStore.find('id', value) 
     var rec = statusStore.getAt(idx); 
     return rec.get('status');      
    }, 
    editor:{ 
     allowBlank: true, 
     xtype:'combobox', 
     valueField:'field1', 
     displayField:'field2', 
     triggerAction:'all', 
     mode: 'local', 
     // change this store to refer to the one we created 
     store: statusStore, 
     value:0, 
     lazyRender: true 
    } 
},  

如果这为您解决，不要忘记在左边标记检查答案。