There are many ways to modify Data Rows, and in this example, we will learn the way to modify the values of the existing row by user input. If use the editing function within SMART datagrid, you can implement user input UI similarly as the existing desktop.
In order for the user to directly edit the data cell and update the row, readOnly of GridBase.editOptions should be set as false and updatable as true (default values both) first. If move Focus to the data cell of the row to be edited and type F2 key to display the editor in advance or directly type the text key, Cell Editing will get started.
In order to commit Row Updating after Editing, you can move the row with using up and down key or mouse. Also, if press Esc key, Editing can be cancelled. When Row Updating is started, an update mark will be displayed in row indicator cell, and if commit the editing to actually update the row, the color of row indicator cell will be changed.
After Row Updating is committed, onRowUpdated event of the data set will be fired. Before Row Updating in the data set, onRowUpdating event will be fired, and if explicitly return false within this event handler, Row Updating will be cancelled.
In addition, you can prevent to start Row Updating in the grid level. If explicitly return false within [c.GridBase.onUpdating]] event handler of the grid, modification will not get started.
grdMain.onUpdating = function (grid, rowIndex) {
if ($('#chkEventUpdatable').is(':checked')) {
return false;
}
};
You can call GridBase.edit to start Row Updating instead of User Input.