{hero}

columns.visible

Since: DataTables 1.10

Enable or disable the display of this column.

Description

DataTables and show and hide columns dynamically through use of this option and the column().visible() / columns().visible() methods. This option can be used to get the initial visibility state of the column, with the API methods used to alter that state at a later time.

This can be particularly useful if your table holds a large number of columns and you wish the user to have the ability to control which columns they can see, or you have data in the table that the end user shouldn't see (for example a database ID column).

Type

This option can be given in the following type(s):

Default

  • Value: true

Examples

Hide the first column with columnDefs:

new DataTable('#myTable', {
	columnDefs: [{ visible: false, targets: 0 }]
});

Hide the first column with columns:

new DataTable('#myTable', {
	columns: [{ visible: false }, null, null, null, null]
});

Related

The following options are directly related and may also be useful in your application development.