Available in the Full Version

Data Grid - Column Management

This sample demonstrates how to configure Column Resizing, Column Moving and Hiding functionality in igGrid.

This sample is designed for a larger screen size.

On mobile, try rotating your screen, view full size, or email to another device.

Resizing: Use the mouse to resize a column by draging its header's right border. Note: Column resizing is not supported on touch enabled devices. Moving: On mouse enabled devices use the mouse to drag and drop column headers to rearrange their columns. On mouse and touch enabled devices use the column moving icon located on the right of each column header to access the column moving dropdown. You can move multiple columns by using the "Move Columns" dialog accessible from each column moving dropdown. Hiding: To hide a column click on the column hiding icon located on the right of each column header. To show a column click on the hidden columns indicator located on the left of the adjacent visible column where the hidden column previously resided. You can choose to hide/unhide multiple columns by using the "Column Chooser" dialog accessible from each hidden columns indicator.

Code View

Copy to Clipboard