组合框只显示displayField单击时

Question

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

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

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

的问题是，当我点击组合框ComboBox的displayField中仅示出。点击后，我可以选择“允许”，“不允许”。当我移除焦点时，数值显示为：“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纳伦德拉业力的回应，我修改了代码，例如：

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

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

1. 配置渲染
2. 它将提供选择的值，以及相关的储存记录
3. 你可以在你的逻辑返回显示值筑底（接受任何价值直译）