Search code examples
angulargriddevextremedx-data-grid

DevExtreme Hide Column EditMode Angular2


how can I hide a DataGrid Column in EditMode using DevExtreme and Angular2?

<h3>Test</h3>
<dx-data-grid id="gridContainer" 
[dataSource]="xxx" 
[allowColumnReordering]="true" 
[allowColumnResizing]="true" 
[rowAlternationEnabled]="true">
<dxo-column-chooser [enabled]="true"></dxo-column-chooser>
    <dxi-column dataField="Id" 
    [visible]="false" 
    [width]="50"
    [allowEditing]="false" ></dxi-column>
    <dxi-column dataField="Name"></dxi-column>
    <dxi-column dataField="Type"></dxi-column>
    <dxi-column dataField="Data"></dxi-column>
    <dxo-editing mode="form"
                 [allowUpdating]="true"
                 [allowDeleting]="true"
                 [allowAdding]="true">
    </dxo-editing>
</dx-data-grid>

The Column is not shown on the Grid, but on the Editform..

Thanks for the help.


Solution

  • The similar question is here - hide columns on inserting in data grid devextreme

    But in Angular2 approach code should be like below:

    <dxi-column dataField="Id" 
        [visible]="false" 
        [width]="50"
        [formItem]="{visible: false}"
        [allowEditing]="false" ></dxi-column>
    

    This line [formItem]="{visible: false}" is useful for you.