grid - sencha - extjs docs

ExtJS 4 RowEditing deshabilita la edición en una columna basada en el registro

Question

Estoy implementando un panel de cuadrícula con las últimas cuatro columnas editables para la mayoría de las filas. El problema es que me gustaría poder deshabilitar la edición, digamos la primera si record.get (''estado'') = 4 que está finalizado y solo dos de las columnas deberían ser editables.

¿Hay alguna manera de desactivar la visualización de la edición de esas filas? Puedo hacerlo usando CellEditing pero quiero seguir usando el complemento RowEditing.

Saludos, Kristian

Answer 1

(basado en el ejemplo anterior) una forma alternativa es configurar el beforeedit escucha de edición beforeedit del editor:

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();}
}
}

Answer 2

Ya que la respuesta de @Molecular Man hace que la columna deshabilitada parezca un poco divertida cuando se está editando, pensé en otra forma que se ve perfecta. Todo lo que tienes que hacer es crear una función, que puede ser, por ejemplo:

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;
}
}

Y en la cuadrícula, pones algo como esto:

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

y cuando isGuest es verdadero, el campo ''nombre'' no será editable. Cuando sea falso, será editable.

Answer 3

Utilice el evento beforeedit :

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

ACTUALIZAR
La solución anterior no funciona para rowEditor.
Sin embargo, puede hacer que el campo necesario se deshabilite en la beforeedit . Para hacer eso deberías poder acceder al plugin de rowediting. Asignar pluginId a plugin:

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

Ahora simplemente deshabilite el campo necesario si se cumplen algunas condiciones:

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();
});

Aquí está la demo (intente editar la primera fila).

Editar

Si el JSFiddle anterior no funciona, pruebe su versión actualizada .