Next
Update
Prev
Change History
Change History (XML)

The ComboBox component can be used to edit the cell by setting the value of the itemEditor attribute to ComboBoxEditor. This example demonstrates how to define Code that is the actual value (e.g. GMC-1 Release1) and Label that is to be displayed in the cell (e.g. GMC-1 R1).

Double click on the Subject column.

...
    <DataGridColumn dataField="Subject" ... itemEditor="ComboBoxEditor" editorDataField="selectedDataField" itemRendererDataField="code" itemRenderer="DataProviderItem" itemRendererDataProvider="[{'label':'GMC-1 R1','code':'GMC-1 Release1'},{'label':'GMC-1 R2','code':'GMC-1 Release2'}, {'label':'GMC-1 R3','code':'GMC-1 Release3'}, {'label':'GMC-1 R4','code':'GMC-1 Release4'}, {'label':'GMC-1 R5','code':'GMC-1 Release5'}, {'label':'GMC-1 R6','code':'GMC-1 Release6'}]" />
...
editorDataField The value must be selectedDataField.
itemRendererDataField This property is to set the name of the field that contains code, which is defined in the value of the itemRendererDataProvider property.
itemRendererLabelField This property is to set the name of the field that contains the label displayed in the cell, which is defined in the value of the itemRendererDataProvider property. (default value : label)
itemRenderer The value must be DataProviderItem.
itemRendererDataProvider This property is to set the values of the ComboBox.

© 2017 KoolChart. All rights reserved.