Available in the Full Version

Data Grid - Multi-Row Layout Editing

This sample demonstrates the inline editing functionality of a Multi-Row Layout grid, which makes it possible to define a more complex structure in which to present the data. The Мulti-Row Layout is defined using rowIndex, columnIndex, rowSpan and colSpan attributes in the column collection.

Grid edit mode:


In order to change igGrid`s edit mode please select a value from the drop down menu below.

This sample is designed for a larger screen size.

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

Users also may define a custom order in which cells are traversed in edit mode using the navigationIndex property of columns in the column collection. The numbers assigned should range from 0 to the number of columns -1 and should not repeat. Columns that don't have navigationIndex specified will be traversed in the order of the normal browser TAB sequence. The sample demonstrates one such custom order.

Code View

Copy to Clipboard