Question

我有一个EditorGridPanel，我通过Ext.Window显示。

resources是我通过Ajax调用得到的Json数据。

示例数据：{"data":[{"id":"1","allowed":"1","roleId":"0","resource":"nothing"}]}

问题是ComboBox的displayField仅在我单击ComboBox时显示。点击后，我得到了选择：“允许”，“不允许”。当我移除焦点时，会显示值：“1”，“0”。

即使我没有点击，如何显示displayField-values？

showRoleDetails: function(resources, roleId) {
        var rolesData = resources;

        var store = new Ext.data.JsonStore({
            url: '/plugin/Registration/admin/get-acl-resources-of-role',
            baseParams: { role: roleId},
            storeId: 'myStore',
            root: 'data',

            fields: [   
                        {name: 'allowed'},
                        {name: 'resource'}
                       ]
          });

        store.load();

        var grid = new Ext.grid.EditorGridPanel({
            title: "Edit / View permissions for resources",
            store: store,
            autoHeight: true,
            columns: [

                        {
                            header: 'Allowed',
                            dataIndex: 'allowed',
                            editor: new Ext.form.ComboBox({
                                triggerAction: 'all',
                                frame: true,
                                lazyRender:true,
                                editable: false,
                                mode: 'local',
                                value: 'allowed',
                                store: new Ext.data.JsonStore({
                                      fields : ['allowed', 'allowedLabel'],
                                      data   :
                                            [
                                                 {
                                                     allowed: '1',
                                                     allowedLabel: 'allowed'
                                                 },
                                                 {
                                                     allowed: '0',
                                                     allowedLabel: 'not allowed'
                                                 }
                                             ]
                                }),
                                valueField: 'allowed',
                                displayField: 'allowedLabel'
                           })   
                        },
                        {
                            header: 'Resource',
                            dataIndex: 'resource'
                        }
                      ]
        });

        var window = new Ext.Window({
            items: grid
        });
        window.show();

    }

编辑： Following Narendra Kamma的回复，我编辑了我的代码：

var comboBox = new Ext.form.ComboBox({ //Combox values need to be filled up
        triggerAction: 'all',
        frame: true,
        lazyRender:true,
        editable: false,
        mode: 'local',
        value: 'allowed',
        store: new Ext.data.JsonStore({
              fields : ['allowed', 'allowedLabel'],
              data   :
                    [
                         {
                             allowed: '1',
                             allowedLabel: 'allowed'
                         },
                         {
                             allowed: '0',
                             allowedLabel: 'not allowed'
                         }
                     ]
        }),
        valueField: 'allowed',
        displayField: 'allowedLabel'
    })  ;

    var me = this;

    var grid = new Ext.grid.EditorGridPanel({
        title: "Edit / View permissions for resources",
        store: store,
        autoHeight: true,
        columns: [

                    {
                        header: 'Allowed',
                        dataIndex: 'allowed',
                        editor:  comboBox,
                        renderer: me.comboBoxRenderer(comboBox)
                    },
                    {
                        header: 'Resource',
                        dataIndex: 'resource'
                    }
                  ]
    });

这非常有效。

Answer 1

您应该自己渲染显示值。在网格列规范中查找渲染器选项。

配置渲染器
它将提供所选值和相关商店记录
您可以根据您的逻辑返回显示值（字面上接受任何值）

ComboBox仅在单击时显示displayField

1 个答案: