установка конфигурации readOnly в поле column.editor на основе значения другого столбца - PullRequest
0 голосов
/ 17 сентября 2018

У меня есть сетка first.GridPanel, которая наследуется от second.GridPanel типа x Ext.grid.GridPanel. В first.GridPanel у меня есть добавить три новых столбца в сетку динамически. Я делаю это в этой строке.

this.columns.push(this.createColumn('stability'), this.createColumn('roadSafty'), this.createColumn('durability'));

Сетка имеет имя столбца severity, которое добавляется к сетке в second.GridPanel и имеет значение int, равное 1 или 2. Теперь я хочу отобразить значения трех новых столбцов на основе значение серьезности при добавлении новой строки в сетку first.GridPanel.

  • Так что, если значение серьезности равно 1 ->, тогда я должен установить значение по умолчанию для комбинированного списка в 3 столбцах, равное 0, и установить для комбинированного списка значение readOnly = true.
  • Если значение серьезности равно 2 -> значение комбо должно быть пустым, и его можно редактировать, также пользователь может выбрать значение от 0 до 4.

Я пытаюсь выполнить эту работу в средстве визуализации столбцов, но при настройке редактора столбцов readOnly config в значение true или false, он устанавливается для всех выпадающих списков. в сетке, и он не устанавливается в поле с позицией (rowIndex, colIndex).

Как установить конфигурацию readOnly комбо для поля с положением (rowIndex, colIndex) в сетке?

код

Ext.define('first.GridPanel', {

        extend : 'second.GridPanel',

        alias : 'widget.grid',

        viewConfig : {
            plugins : {
                ptype : 'gridviewdragdrop',
                pluginId : 'defectsGridPlugin',
                dragGroup : 'defects',
                dropGroup : 'defects'
            },
            listeners : {
                beforedrop : 'beforeDropFunc',
                drop : 'dropFunc'
            }
        },

        plugins : {
            ptype : 'cellediting',
            clicksToEdit : 1
        },

        initComponent : function() {
            this.columns.push(this.createColumn('stability'), this.createColumn('roadSafty'), this.createColumn('durability'));
            this.callParent(arguments);
        },


        createColumn : function(columnName) {
            var column = {
                bind : {
                    text : '{defectTabTexts.' + columnName + 'Text}'
                },
                dataIndex : columnName,
                itemId : columnName + 'Column',
                cellWrap : true,
                minWidth : 60,
                resizable : true,
                renderer : function(value, metaData, record, rowIndex, colIndex, store) {
                    var editor = this.getColumnById(columnName).getEditor(record);
                    console.log(editor.id);
                    if (record.get('severity') == 1) {
                        editor.setReadOnly(true);
                        editor.setEditable(false);
                        return 0;
                    }
                    editor.setReadOnly(false);
                    editor.setEditable(true);
                    return value;
                },
                editor : {
                    xtype : 'combobox',
                    itemId : columnName + 'Combo',
                    queryMode : 'local',
                    displayField : 'value',
                    valueField : 'value',
                    forceSelection : false,
                    typeAhead : true,
                    store : {
                        fields : [ 'value' ],
                        data : [ {
                            'value' : '0'
                        }, {
                            'value' : '1'
                        }, {
                            'value' : '2'
                        }, {
                            'value' : '3'
                        }, {
                            'value' : '4'
                        } ]
                    }
                }
            };
            return column;
        }
    });
...