Question

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

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

我想我无法发布图片，所以我在这里给你代码：

如果我在Combo的商店中使用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
}

当我在Combo的商店中以不同的方式指定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
}

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

嗨感谢您的回复，我已按您的建议完成了更改，但不知何故，它对我不起作用。这是Code。我的商店是

 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

“如果当前显示的值与组合商店匹配，那么它应该显示为已选中，但它没有显示“

组合框与其与displayField值匹配的valueField值不匹配。

像你这样硬编码的组合框数据存储区将自动将第一项（例如'1'）作为valueField，将第二项（例如'NOT_STARTED'）作为displayField。

因为“数字”值（“1”，“2”，“3”）都没有与此列中的值（“NOT_STARTED”，“IN_PROGRESS”，“COMPLETED”）匹配，所以它不会显示任何内容。

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

你可以做两件事：

EASIEST：只需将值字段保留为字符串，不要将其作为数字。

HARDER：如果你确实需要这个号码作为某些（未说明的）原因：

您更改网格数据存储区中的数据，以便所有数据对于此列，是一个数字（1,2,3）而不是字符串。
在此列中添加renderer配置以将数字显示为行正在编辑时
然后，按照您尝试将数据存储设置为的方式进行操作 [number - string]个对象。另外，如果您的商店中的商品数量超出商品数量你打算这样做。

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

希望这一切都有道理。

修改

这是代码。

首先，将状态元素放在一个单独的商店中 - 如下所示：

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

其次，将“status”的值更改为您想要的数字字符串（“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 } },

如果这样做，请不要忘记在左侧标记答案的检查。

ExtJS使用Roweditor与组合不能正常工作

1 个答案: