The requested page is not available for the requested platform. You are viewing the content for Default platform.

ASPxClientGridView.UpdateEdit Method

Saves all the changes made and switches the grid to browse mode.

Declaration

UpdateEdit(): void

Remarks

End-users can update the edited row by clicking the Update command item.

The following code sample illustrates how to use the UpdateEdit method to show a confirmation message after a user updates the grid.

<dx:ASPxGridView ID="ASPxGridView1" runat="server" ClientInstanceName="gv"  
  OnCommandButtonInitialize="ASPxGridView1_CommandButtonInitialize" AutoGenerateColumns="False"
  DataSourceID="ads" KeyFieldName="CategoryID">
    <Columns>
        <dx:GridViewCommandColumn Caption=" " VisibleIndex="0" Width="100">
            <NewButton Visible="True" />
            <EditButton Visible="True" />
            <DeleteButton Visible="True" />
            <CustomButtons>
                <dx:GridViewCommandColumnCustomButton ID="customBtnUpdate" Visibility="EditableRow" Text="Update" />
                <dx:GridViewCommandColumnCustomButton ID="customBtnCancel" Visibility="EditableRow" Text="Cancel" />
            </CustomButtons>
        </dx:GridViewCommandColumn>
        ...
    </Columns>
    <ClientSideEvents CustomButtonClick="OnCustomButtonClick" />
    ...
</dx:ASPxGridView>

Examples

To change ASPxGridView's data from the client side, there are appropriate ASPxClientGridView methods:

To save or cancel changes, there are:

The following example implements a custom defined toolbar with ASPxButtons, which perform all the editing capabilities over a grid's data source.

Note: to distinguish records, the property ASPxGridViewBehaviorSettings.AllowFocusedRow should be enabled for the grid.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.5.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxGridView" TagPrefix="dxwgv" %>
<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.5.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dxe" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>How to implement a toolbar for grid with Inserting, Updating and Deleting capabilities</title>

    <script language="javascript" type="text/javascript">
    function OnNewClick(s, e) {
        grid.AddNewRow();
    }

    function OnEditClick(s, e) {
        var index = grid.GetFocusedRowIndex();
        grid.StartEditRow(index);
    }

    function OnSaveClick(s, e) {
        grid.UpdateEdit();
    }

    function  OnCancelClick(s, e) {
        grid.CancelEdit();
    } 

    function  OnDeleteClick(s, e){
        var index = grid.GetFocusedRowIndex();
        grid.DeleteRow(index);
    }  
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table>
                <tr>
                    <td>
                        <dxe:ASPxButton ID="btnNew" runat="server" Text="New" AutoPostBack="false">
                            <ClientSideEvents Click="function (s, e) { OnNewClick(s, e); }" />
                        </dxe:ASPxButton>
                    </td>
                    <td>
                        <dxe:ASPxButton ID="btnEdit" runat="server" Text="Edit" AutoPostBack="false">
                            <ClientSideEvents Click="function (s, e) { OnEditClick(s, e); }" />
                        </dxe:ASPxButton>
                    </td>
                    <td>
                        <dxe:ASPxButton ID="btnSave" runat="server" Text="Save" AutoPostBack="false">
                            <ClientSideEvents Click="function (s, e) { OnSaveClick(s, e); }" />
                        </dxe:ASPxButton>
                    </td>
                    <td>
                        <dxe:ASPxButton ID="btnCancel" runat="server" Text="Cancel" AutoPostBack="false">
                            <ClientSideEvents Click="function (s, e) { OnCancelClick(s, e); }" />
                        </dxe:ASPxButton>
                    </td>
                    <td>
                        <dxe:ASPxButton ID="btnDelete" runat="server" Text="Delete" AutoPostBack="false">
                            <ClientSideEvents Click="function (s, e) { OnDeleteClick(s, e); }" />
                        </dxe:ASPxButton>
                    </td>
                </tr>
                <tr>
                    <td colspan="5">
                        <dxwgv:ASPxGridView ID="grid" runat="server" ClientInstanceName="grid" OnRowDeleting="grid_RowDeleting"
                            OnRowInserting="grid_RowInserting" OnRowUpdating="grid_RowUpdating" OnInitNewRow="grid_InitNewRow">
                            <SettingsBehavior AllowFocusedRow="True" />
                            <Templates>
                                <EditForm>
                                    <dxwgv:ASPxGridViewTemplateReplacement ReplacementType="EditFormEditors" ID="ASPxGridViewTemplateReplacement3"
                                        runat="server">
                                    </dxwgv:ASPxGridViewTemplateReplacement>
                                </EditForm>
                            </Templates>
                        </dxwgv:ASPxGridView>
                    </td>
                </tr>
            </table>
        </div>
    </form>
</body>
</html>
See Also