Custom editors, validations and filter keys

Column Ship Country has autocomplete editor with remote data and remote validation.

Column Books also has autocomplete editor but with local data and validation.

Column Fruits has radio button editor

Column Order Date has jQueryUI date picker custom editor.

Column ShipVia has select editor. It stores primary keys of ShipVia i.e., SE, UP, FS in a hidden column ShipViaId while displays corresponding text values itself.

Column ShipVia2 also has select editor. It stores primary keys i.e., SE, UP, FS in the same column and displays corresponding text values by implementing column.render callback.

Column Freight is of float data type, hence filters the non numeric keys

Column Ship Address has multiline text editor. Line breaks can be added either by:

Single click edit

Value of editModel.clicksToEdit decides whether single or double click is required to put cell in edit mode.


Validations are defined for columns with validations option which is an array of one or more validation objects.

validations: [
   { type: 'regexp', value: '^[0-9]{2}/[0-9]{2}/[0-9]{4}$', msg: 'Not in mm/dd/yyyy format' }

Validations can take place in 2 alternative ways depending upon allowInvalid parameter:

allowInvalid parameter can be set at the source of change or during processing of data.

At source: During processing: