How to: Update Total Summaries on the Client Side in Batch Edit Mode

• Dec 17, 2020

The following example updates total summaries on the client side when ASPxCardView is in Batch Edit mode.

Default.aspx

<script type="text/javascript">
    function OnBatchEditEndEditing(s, e) {
        var originalValue = s.batchEditApi.GetCellValue(e.visibleIndex, "UnitPrice");
        var newValue = e.cardValues[(s.GetColumnByField("UnitPrice").index)].value;
        var dif = newValue - originalValue;
        labelSum.SetValue((parseFloat(labelSum.GetValue()) + dif).toFixed(1));
    }
</script>

<dx:ASPxCardView ID="ASPxCardView1" runat="server" AutoGenerateColumns="False" 
                 DataSourceID="SqlDataSource1" KeyFieldName="ProductID">
    <SettingsEditing Mode="Batch" />
    <Settings ShowTitlePanel="true" />
    <Templates>
        <TitlePanel>
            Sum =
            <dx:ASPxLabel ID="ASPxLabel1" runat="server" 
                          ClientInstanceName="labelSum" 
                          Text='<%# GetTotalSummaryValue() %>' />
        </TitlePanel>
    </Templates>
    <Columns>
        <dx:CardViewTextColumn FieldName="ProductID" Visible="False">
        <dx:CardViewTextColumn FieldName="ProductName" />
        <dx:CardViewTextColumn FieldName="UnitPrice" />
        <dx:CardViewTextColumn FieldName="UnitsInStock" />
        <dx:CardViewTextColumn FieldName="UnitsOnOrder" />
    </Columns>
    <ClientSideEvents BatchEditEndEditing="OnBatchEditEndEditing" />
    <TotalSummary>
        <dx:ASPxCardViewSummaryItem SummaryType="Sum" FieldName="UnitPrice" />
    </TotalSummary>
</dx:ASPxCardView>

Default.aspx.cs

protected object GetTotalSummaryValue() {
    ASPxCardViewSummaryItem summaryItem = ASPxCardView1.TotalSummary.First(i => i.FieldName == "UnitPrice");
    return ASPxCardView1.GetTotalSummaryValue(summaryItem);
}
protected void ASPxLabel1_Init(object sender, EventArgs e) {
    var label = (ASPxLabel)sender;
    label.DataBind();
}

Default.aspx.vb

Protected Function GetTotalSummaryValue() As Object
    Dim summaryItem As ASPxCardViewSummaryItem = ASPxCardView1.TotalSummary.First(Function(i) i.FieldName = "UnitPrice")
    Return ASPxCardView1.GetTotalSummaryValue(summaryItem)
End Function
Protected Sub ASPxLabel1_Init(ByVal sender As Object, ByVal e As EventArgs)
    Dim label = DirectCast(sender, ASPxLabel)
    label.DataBind()
End Sub