Batch Edit Mode
- 4 minutes to read
The ASPxCardView control allows you to modify a batch of grid data on the client side and send it to the server in a single request. All user changes are maintained on the client side until the Save changes button is clicked, or all changes are cancelled by clicking the Cancel changes button. To enable the batch editing functionality, set the ASPxCardViewEditingSettings.Mode property to Batch.
In this mode, the grid data contained in a page can be edited using in-line editors. The CardViewBatchEditSettings.EditMode property allows you to specify which control element (data cell or card) is used to edit data.
To prevent an end-user from editing column cells, set the column’s GridColumnEditFormSettings.Visible property to false. In this case, column cells cannot be switched to edit mode. When an end-user navigates through cells using the TAB key, column cells are skipped.
Note
Since data modification is performed on the client side in batch edit mode, the server-side ASPxCardView.StartEdit and ASPxCardView.AddNewCard methods are not in effect. Additionally, the client-side ASPxClientCardView.AddNewCard method does not perform a callback.
If a grid contains modified data, it displays a “confirm” message before a grid callback or postback is performed. You can customize the message text using the ASPxGridTextSettings.ConfirmOnLosingBatchChanges property, or you can disable it by setting the GridBatchEditSettings.ShowConfirmOnLosingChanges property to false.
Note
Since card selection is based on row keys, and the newly created cards do not exist in the grid (have no row keys), newly created cards cannot be selected until they are saved. That’s why select check boxes of newly created cards are disabled until they are saved.
Batch Edit Mode Events
In batch edit mode, you can use the ASPxClientCardView.BatchEditStartEditing and ASPxClientCardView.BatchEditEndEditing events to perform custom actions when grid editing starts and ends, respectively.
Appearance Customization
You can customize visual presentation of modified data items using the following properties.
- CardViewStyles.BatchEditModifiedCell - Contains style settings for modified data cells.
- CardViewStyles.BatchEditNewCard - Contains style settings for newly added cards.
- CardViewStyles.BatchEditDeletedCard - Contains style settings for deleted cards.
The card view stores the Update and Cancel buttons within its status bar. Use the status bar‘s style settings to control these buttons appearance.
The following code snippets illustrate how to hide the Update and Cancel buttons.
Using the ASPxGridSettings.ShowStatusBar property.
... <Settings ShowStatusBar="Hidden"/> ...
Modifying the card view’s dxcvStatusBar CSS class.
.dxcvStatusBar { display: none; }
Batch Edit Mode Limitations
- Endless Paging mode is not supported.
- The JavaScript code contained within the href link attribute is not executed in Internet Explorer. To learn more, see the Links / “A” tags do not work in IE together with the GridView in Batch Edit Mode Knowledge Base Article.
- The date range functionality of embedded date editors does not work in the Cell batch edit mode.
- The card view loses focus and finishes the batch edit mode when trying to edit the CardViewDropDownEditColumn column whose drop-down editors are located within the DropDownWindowTemplate object.
Code Examples
A simple Batch Editing implementation
How to set a different color for the modified cell in different columns
How to cancel editing or disable the editor conditionally
How to conditionally enable and disable the editing on the client side
How to implement copy and clone functionality
How to calculate values on the fly
How to implement custom date validation
How to update total summaries on the client side
How to implement cascading comboboxes
How to update a master grid and all its detail grids simultaneously