DevExtreme DataGrid: Show item only in add, not in edit popup

Question

I'm using a DevExtreme DataGrid in Angular 5. Add and Edit are activated and used in a Popup. There is on field, which should appear only at the Add-popup, but not at the Edit-Popup. In the normal DataGrid it is disabled anyway.

<dxi-column dataField="Staff" [visible]="false">...

How to enable the staff field in Add and disable it in Edit-Popup?

Thank you for help! Frank

Answer 1

To accomplish this task, either use onEditorPreparing or onEditingStart and onInitNewRow. Please refer to the code below that illustrates both solutions in action:

The first solution:

<dx-data-grid 
    (onEditorPreparing)="onEditorPreparing($event)">

onEditorPreparing(e) {
    if(e.parentType === "dataRow" && e.dataField === "CityID") {
        e.editorOptions.disabled = (typeof e.row.data.StateID !== "number");
    }
}

The second solution:

onEditingStart(e) {
    e.component.columnOption("firstName", "allowEditing", false);
},
onInitNewRow(e) {
    e.component.columnOption("firstName", "allowEditing", true);
}