This sample demonstrates the Grid column chooser feature. Click the column chooser icon in the toolbar to open column chooser and you can select columns to hide/show from the checkbox list.
Order ID | Customer Name | Order Date | Freight | Shipped Date | Ship Country | Ship City |
---|---|---|---|---|---|---|
10248 | Maria | 7/4/1996 | $32.38 | 7/16/1996 | France | Reims |
10249 | Ana Trujillo | 7/5/1996 | $11.61 | 7/10/1996 | Germany | Münster |
10250 | Antonio Moreno | 7/8/1996 | $65.83 | 7/12/1996 | Brazil | Rio de Janeiro |
10251 | Thomas Hardy | 7/8/1996 | $41.34 | 7/15/1996 | France | Lyon |
10252 | Christina Berglund | 7/9/1996 | $51.30 | 7/11/1996 | Belgium | Charleroi |
10253 | Hanna Moos | 7/10/1996 | $58.17 | 7/16/1996 | Brazil | Rio de Janeiro |
10254 | Frédérique Citeaux | 7/11/1996 | $22.98 | 7/23/1996 | Switzerland | Bern |
10255 | Martín Sommer | 7/12/1996 | $148.33 | 7/15/1996 | Switzerland | Genève |
10256 | Laurence Lebihan | 7/15/1996 | $13.97 | 7/17/1996 | Brazil | Resende |
10257 | Elizabeth Lincoln | 7/16/1996 | $81.91 | 7/22/1996 | Venezuela | San Cristóbal |
10258 | Victoria Ashworth | 7/17/1996 | $140.51 | 7/23/1996 | Austria | Graz |
10259 | Patricio Simpson | 7/18/1996 | $3.25 | 7/25/1996 | Mexico | México D.F. |
The Grid columns can be shown/hidden dynamically by using column chooser. To enable column chooser behavior, set showColumnChooser property as true. You can also prevent the display of a column by setting columns->showInColumnChooser as false in columns definition. In this demo, when the user clicks column chooser icon from the toolbar then the column chooser menu will open, User can show or hide the columns by changing the state of the checkbox.