Step 5: Enable Data Edit Operations

• Dec 30, 2021

This step describes how to allow users to edit data.

Note

This tutorial uses the Issues Service as a sample data source.

Run Demo: Infinite Scrolling Source - Step 5

Allow Users to Edit Data

1. Set the ColumnBase.AllowEditing property to true for the columns that users can edit.

2. Set the TableView.ShowUpdateRowButtons property to OnCellEditorOpen / OnCellValueChange to enable Edit Entire Row mode.

3. Create a task that uses the Issues Service‘s UpdateRowAsync method to save changes to the data source.

4. Create an UpdateIssue command in the ViewModel. To save changes asynchronously, assign the task to the RowValidationArgs.ResultAsync property.

5. Bind the command to the GridViewBase.ValidateRowCommand property.

Xaml

<dxg:GridControl>
    <dxg:GridControl.Columns>
        <dxg:GridColumn FieldName="Subject" IsSmart="True" AllowEditing="True"/>
        <dxg:GridColumn FieldName="User" IsSmart="True" AllowEditing="True"/>
        <dxg:GridColumn FieldName="Created" IsSmart="True" AllowEditing="True"/>
        <dxg:GridColumn FieldName="Votes" IsSmart="True" AllowEditing="True"/>
        <dxg:GridColumn FieldName="Priority" IsSmart="True" AllowEditing="True"/>
    </dxg:GridControl.Columns>
    <dxg:GridControl.View>
        <dxg:TableView ShowUpdateRowButtons="OnCellEditorOpen"
                       ValidateRowCommand="{Binding UpdateIssueCommand}"/>
    </dxg:GridControl.View>
</dxg:GridControl> 

C#

[Command]
public void UpdateIssue(RowValidationArgs args) {
    args.ResultAsync = UpdateIssueAsync((IssueData)args.Item);
}
static async Task<ValidationErrorInfo> UpdateIssueAsync(IssueData issue) {
    await IssuesService.UpdateRowAsync(issue);
    return null;
}

Continue or Review

• Proceed to the next tutorial - How to Bind to a Custom Service with Restrictions.
• Review Step 4 - Display Summaries.