We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Updating Summary Row with Batch Edit

Thread ID:

Created:

Updated:

Platform:

Replies:

121227 Nov 19,2015 09:57 PM UTC Nov 25,2015 06:09 AM UTC ASP.NET Web Forms 5
loading
Tags: Grid
James
Asked On November 19, 2015 09:57 PM UTC

Hi,

I have a summary row which is basically a "Sum" operation on a grid with EditMode "Batch".

Unfortunately, as I make changes to the grid, the summary row doesn't update until I save the data.

Does anyone have an idea on how I can get the summary row to update as cells are edited?

Any help is appreciated. Thanks.

James



Ragavee U S [Syncfusion]
Replied On November 20, 2015 05:36 AM UTC

Hi James,

We have created a sample to update the summary row on editing and saving a cell in batch editing, which can be downloaded from the below location.

Sample Link: http://www.syncfusion.com/downloads/support/forum/121227/ze/Sample2024805759

In the above sample, we have pdated the summary row using the CellSave clientside event. Please refer to the below code example.

<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True" >

<ClientSideEvents CellSave="cellSave" />

. . .

<EditSettings AllowEditing="True" AllowAdding="True" AllowDeleting="True"EditMode="Batch"></EditSettings>

</ej:Grid>

<script type="text/javascript">

            function cellSave(args) {

                if (args.columnName == "Freight") {

                    var newvalue = args.value;// getting the new value

                    var oldvalue = args.rowData.Freight;// getting the old value

                    var extra = newvalue - oldvalue;//getting the difference in value

                    var summary = ($("td.e-summaryrow")[args.cell.index()].innerHTML).replace(/[$,]/g, "")

                    var summaryval = (parseFloat(summary) + extra).toFixed(2);

                    summaryval = addCommas(summaryval);//add commas to the obtained value

                    $("td.e-summaryrow")[args.cell.index()].innerHTML = "$" + summaryval;//assigning the innerHTML of the summaryrow with updated value

                }

            }          


            </script>



Regards,
Ragavee U S.

James
Replied On November 20, 2015 04:34 PM UTC

Thanks so much for such a quick response. The solution you have provided works well in the event that I have only 1 summary row but in my project I have 2 summary rows and I only need to update 1. The solution you provided will always only update the first summary record.

I was hoping that I could assign a css class or ID to the summary record that I wanted and then modify the CSS selector in your sample to search based on that new ID/class but it looks like I can't assign a CSS class or ID to the summary row as it only has 4 properties: Title, SummaryColumns, ShowCaptionSummary, and ShowTotalSummary.

If there's a workaround for this that would be great, otherwise I'll just have to rearrange the summary rows so that the Sum row is the first one.

Thanks again.

James

Ragavee U S [Syncfusion]
Replied On November 23, 2015 08:33 AM UTC

Hi James,
 
We have modified the solution based on your requirement and the sample can be downloaded from the below location.
 
Sample Link: http://www.syncfusion.com/downloads/support/forum/121227/ze/Sample_modified1674156755
 
In the above sample, we have obtained the corresponding summaryRow index to be modified using Grid model SummaryRows and thus updated that summaryRow. Please refer to the below code example.
 

<script type="text/javascript">

            function cellSave(args) {

                if (args.columnName == "Freight") {

                    var newvalue = args.value;// getting the new value

                    var oldvalue = args.rowData.Freight;// getting the old value

                    var extra = newvalue - oldvalue;//getting the difference in value

                    for (var i = 0; i < this.model.summaryRows.length; i++)

                        for (var j = 0; j < this.model.summaryRows[i].summaryColumns.length; j++) {

                            if (this.model.summaryRows[i].summaryColumns[j].dataMember == "Freight" && this.model.summaryRows[i].summaryColumns[j].summaryType == "sum"){

                                j = i;// finding the summaryRow to be modified

                                break;

                        }

                    }

                    var summary = ($(".e-gridSummaryRows:eq(" + j + ")").find("td.e-summaryrow")[args.cell.index()].innerHTML).replace(/[$,]/g, "")// getting the summaryValue of the corresponding summaryRow

                    var summaryval = (parseFloat(summary) + extra).toFixed(2);

                    summaryval = addCommas(summaryval);//add commas to the obtained value

                    $(".e-gridSummaryRows:eq(" + j + ")").find("td.e-summaryrow")[args.cell.index()].innerHTML = "$" + summaryval;//assigning the innerHTML of the summaryrow with updated value

                }

            }          

 
           </script>

 
Regards,
Ragavee U S.

James
Replied On November 24, 2015 10:56 PM UTC

Thanks Ragavee, it works perfectly.

Ragavee U S [Syncfusion]
Replied On November 25, 2015 06:09 AM UTC

Hi James,

Thanks for your update.

We are happy that your requirement is achieved.

Regards,
Ragavee U S.

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;