Выпадающий список в виде столбца сетки в ExtJs 4.2. Какой из них лучше и, что важнее, правильный способ сделать

У меня есть требование, когда столбец должен быть комбинированным списком внутри сетки.

1-й путь внутри предметов--

items :[{width : 500,
        margin : '5 5 5 5',
        xtype : 'gridpanel',
        store :'some_store_name',
        sortableColumns : false,
        selType : 'cellmodel',
        plugins : [ {
                ptype : 'cellediting',
            clicksToEdit : 1
            } ],
        columns : [ {
                text : '<b>Column_one</b>',
                dataIndex : 'index_one',
                flex : 1
                },
                       {text : '<b>choose a value</b>',
                dataIndex : 'index_two',
                flex : 1,
                editor : {
                    xtype : 'combobox',
                    store : 'some_store_name',
                    queryMode : 'local',
                    displayField : 'label',
                    valueField : 'label'
                    }}]}]

Это работает правильно. Единственная проблема заключается в том, что пользователь должен нажать на сетку, чтобы узнать, что это поле со списком. Должен ли я использовать CSS и установить свойство, говорящее, что этот конкретный столбец внутри сетки должен выглядеть как комбо? Есть ли другой путь?

2-й способ Вместо использования редактора плагинов мы можем использовать функцию рендерера и возвращать комбинированный список xtype, который заполняется магазином. Если у меня есть 3 столбца внутри сетки, и требование говорит, что это комбо должно быть во втором столбце, то есть ошибка. Когда я нажимаю на комбо, выбираем значение и переходим к третьему столбцу, чтобы изменить текст или вводим / редактируем столбец, который имеет тип (текстовое поле или какой-либо компонент), значение поля со списком исчезает. Почему это так?

     { dataIndex : 'values', text : '<b>Status</b>',   xtype : 'componentcolumn',
  flex : 2,renderer : function(value) {return { name : 'some_name',store : 'some_store',    value : value,xtype : 'combobox',displayField : 'y',valueField : 'x',   queryMode : 'local'};}}}

Любые предложения приветствуются. благодарю вас!

1 ответ

Решение

Использование первого способа является правильным. Если вы хотите, чтобы столбец также отображался как редактируемый, см. Мой ответ на этот вопрос SO: Как показать полный столбец как редактируемый в сетке extjs (редактирование ячеек)?

Причина, по которой второй подход не работает, заключается в том, что комбинированный список никоим образом не привязан к данным записи, которые он должен обновлять. При первоначальном рендеринге вы устанавливаете значение по умолчанию для поля со значением записи через средство рендеринга, но когда кто-то собирается отредактировать это значение, нечего сказать: "Привет, обновите запись и этим значением". Поскольку между записью и выпадающим списком нет определенной привязки, выпадающий список фактически не сообщает записи о новом значении, и поэтому, когда сетка снова отображает значение из записи, обновленное значение для отображения отсутствует.

Другие вопросы по тегам