3

Ext.Windowを介して表示するEditorGridPanelがあります。

resourcesAjax呼び出しで取得した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();

    }

編集： 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'
                    }
                  ]
    });

これは素晴らしく機能します。

4

1 に答える 1

4

表示値は自分でレンダリングする必要があります。グリッド列の仕様でレンダラーオプションを探します。

  1. レンダラーを構成する
  2. 選択した値と関連するストアレコードを提供します
  3. ロジックに基づいて表示値を返すことができます（文字通り任意の値を受け入れます）
于 2011-03-17T11:36:35.247 に答える