Client-side Editing

 
 
OrderID
ShipName
ShipCity
ShippedDate
 
10,248
Vins et alcools Chevalier
Reims
8/16/1994
 
10,249
Toms Spezialitäten
Münster
8/10/1994
 
10,250
Hanari Carnes
Rio de Janeiro
8/12/1994
 
10,251
Victuailles en stock
Lyon
8/15/1994
 
10,252
Suprêmes délices
Charleroi
8/11/1994
 
10,253
Hanari Carnes
Rio de Janeiro
8/16/1994
 
10,254
Chop-suey Chinese
Bern
8/23/1994
 
10,255
Richter Supermarkt
Genève
8/15/1994
 
10,256
Wellington Importadora
Resende
8/17/1994
 
10,257
HILARIÓN-Abastos
San Cristóbal
8/22/1994

The C1GridView supports client editing. This sample shows how to update a dataset stored in the session object when client editing is used and how to provide client-side custom editors.

The following properties are used in this sample:

  • AllowClientEditing - to allow end-user to edit current cell value.
  • AllowKeyboardNavigation - to allow end-user to change current cell position using keyboard.
  • HighlightCurrentCell - to highlight position of the current cell.

The following client-side event handlers are used in this sample to create a custom editor (wijinputdate) for the ShippedDate column:

  • OnClientBeforeCellEdit - creating the custom editor before editing.
  • OnClientBeforeCellUpdate - passing edited value to the grid before editing finishes.
  • OnClientAfterCellEdit - destroying editor when editing is done.

The following server-side event handlers are used in this sample:

  • RowUpdating - updating datasource with the values obtained from client.
  • EndRowUpdating - committing changes.

Current cell goes in edit mode if:

  • It is double-clicked with the left mouse button.
  • F2 key is pressed on the keyboard (cursor is placed at the end of editor area).
  • Any alphanumeric key is pressed (original value is replaced with inputted symbol).

Editing of the current cell is committed if:

  • Current cell position is changed.
  • F2 or Enter key is pressed (only for default editors).

Pressing Esc key cancels editing of the current cell restoring original value.

When current row position is changed all the accumulated changes are sent to server.