Vue Common Types - grids - ColumnChooser

Configures the column chooser.

import { ColumnChooser } from "devextreme/common/grids"
Type:

Object

allowSearch Deprecated

Use DataGrid search.enabled or TreeList search.enabled instead.

Specifies whether searching is enabled in the column chooser.

Type:

Boolean

Default Value: false

emptyPanelText

Specifies text displayed by the column chooser when it is empty.

Type:

String

Default Value: 'Drag a column here to hide it'

enabled

Specifies whether a user can open the column chooser.

Type:

Boolean

Default Value: false

When this property is set to true, a user can open the column chooser with a click on the "Column Chooser" icon. Otherwise, this icon is hidden, but you still can open the column chooser from code by calling the showColumnChooser() method.

DataGrid Demo TreeList Demo

height

Specifies the height of the column chooser.

Type:

Number

|

String

Default Value: 260

mode

Specifies how a user manages columns using the column chooser.

Type:

ColumnChooserMode

Default Value: 'dragAndDrop'

In drag and drop mode, a user moves column headers to and from the column chooser by drag and drop. In select mode, the user selects column headers in the column chooser using check boxes. The select mode is designed primarily for touch-enabled devices. On mouse-equipped platforms, either mode is suitable.

searchTimeout Deprecated

Use DataGrid search.timeout or TreeList search.timeout instead.

Specifies a delay in milliseconds between when a user finishes typing in the column chooser's search panel, and when the search is executed.

Type:

Number

Default Value: 500

sortOrder

Specifies the sort order of column headers.

Type:

SortOrder

Default Value: undefined

If not set, the order is the same as in the columns[] array.

title

Specifies the title of the column chooser.

Type:

String

Default Value: 'Column Chooser'

width

Specifies the width of the column chooser.

Type:

Number

|

String

Default Value: 250