APNSoft.com - Web Controls, components for ASP.NET
 About Us 

Controls Suite 4.5

Reference Book
Live Demos
Populating with Data
Row uniqueness
Alternating rows
Hovered row
CSS Formatting
Client-side selection
Server-side selection
Cell editing
Fixed (Summary) row
Appearance & Layout
Bottom Bar
Application scenarios

On this example the DataGrid allows the user to modify data right in the Grid's area.

When the cell of the selected row is clicked, it is transformed into Input Box for editing the value. To switch between cells you can use the Tab Key (or Shift + Tab to go in reverse). To add a line break, use the CTRL + Enter.

To enable the Cell Editing for a Grid you should set the CellEditingEnabled property value to True. The Column's CellEditingEnabled property is used to disable the Cell Editing for specific column (the CustomerID in the demo above). The server-side event CellValueChanged occurs when the cell value is changed. Input Box for editing can be customized by using the .CellInputBox{} CSS class, which is in the Skin's CSS Style (Style.CSS).

Cell value can be validated and auto-corrected on the client side. The ClientSideBeforeCellUpdate property specifies the client-side code (procedure) to be launched before Cell Update. This procedure should return an error message (is displayed as alert) or false if the value is not correct. To save corrected value, set the client-side variable dg.CellValue. This example does not allow empty cell values and capitalizes first letters for ContactName.

Note. All changes are stored in the user's current session.

Code Samples:

© 2003-2024 APNSoft. All rights reserved.    Terms of use.