Hide a Column Using the API

A column is considered hidden when its visible option is false. You can change this option programmatically using the columnOption(id, optionName, optionValue) method. For example, the following code hides an "Email" column:

jQuery

JavaScript

$("#dataGridContainer").dxDataGrid("columnOption", "Email", "visible", false);

Angular

TypeScript

import { ..., ViewChild } from '@angular/core';
import { DxDataGridModule, DxDataGridComponent } from 'devextreme-angular';
// ...
export class AppComponent {
    @ViewChild(DxDataGridComponent) dataGrid: DxDataGridComponent;
    hideEmails() () {
        this.dataGrid.instance.columnOption("Email", "visible", false);
    }
}
@NgModule({
    imports: [
        // ...
        DxDataGridModule
    ],
    // ...
})

Hide a Column Using the API

jQuery

Angular

See Also