ExtJS 4 RowEditing отключить редактирование одного столбца на основе записи - PullRequest
Новая
       4

ExtJS 4 RowEditing отключить редактирование одного столбца на основе записи

21 голосов
/ 06 октября 2011

Я реализую панель сетки с четырьмя последними столбцами, редактируемыми для большинства строк.Проблема в том, что я хотел бы иметь возможность отключить редактирование, скажем, первое, если record.get ('status') = 4, которое завершено и только два столбца должны быть доступны для редактирования.

Есть ли способ отключить показ редактирования этих строк?Я могу сделать это с помощью CellEditing, но хочу продолжать использовать плагин RowEditing.

С уважением, Кристиан

Ответы [ 3 ]

38 голосов
/ 07 октября 2011

Использование beforeedit событие: 

grid.on('beforeedit', function(editor, e) {
  if (e.colIdx === 0 && e.record.get('status') == 4)
    return false;
});

ОБНОВЛЕНИЕ
Решение выше не работает для rowEditor.
Однако вы можете сделатьнеобходимое поле для отключения на beforeedit.Для этого вы должны иметь доступ к плагину rowediting.Назначьте pluginId для плагина: 

plugins: [
    Ext.create('Ext.grid.plugin.RowEditing', {
        clicksToEdit: 1,
        pluginId: 'rowEditing'
    })
],

Теперь просто отключите необходимое поле, если выполнены некоторые условия: 

grid.on('beforeedit', function(editor, e) {
    if (e.record.get('status') === 4 ){
         grid.getPlugin('rowEditing').editor.form.findField('fieldToDisable').disable();
    }
    else{
        grid.getPlugin('rowEditing').editor.form.findField('fieldToDisable').enable();
   });

Вот demo (попробуйте изменить первую строку).

Редактировать

Если вышеуказанный JSFiddle не работает, попробуйте его обновленную версию .

1 голос
/ 07 августа 2015

(на основе предыдущего примера) альтернативным способом является настройка beforeedit слушателя редактора: 

listeners: {
    beforeedit: function(editor, context) {
        var form   = editor.getEditor().form;
        var field  = form.findField('column_name');
        var status = parseInt(context.record.data.status);
        if(status === 4){field.disable();} else {field.enable();}
    }
}
0 голосов
/ 05 мая 2016

Поскольку при ответе @Molecular Man отключенный столбец выглядит довольно забавно, когда редактирование строки редактирует, я подумал о другом способе, который выглядит идеально.Все, что вам нужно сделать, это создать функцию, которая может быть, например: 

function fieldFormat() {
    if(isGuest) {
        return null; //is not editable
    } else {
        //how you want the column's field config to be formated
        var json = Ext.JSON.decode("{xtype: 'textfield',maxLength: 40}");
        return json;
    }
}

и в сетку вы добавляете что-то вроде этого: 

var grid = Ext.create('Ext.grid.Panel', {
    plugins: [grid_rowEditing],
    store: store,
    columns: [
    {
        text     : 'Name',
        dataIndex: 'name',
        field    : fieldFormat()
    }]
});

и когда isGuest true, поле 'name' не будет редактируемым.Когда оно ложно, оно будет доступно для редактирования

...