model.currentViewData does not update when an element gets removed in batch mode

[Islam yahia]

Hi,

I'm trying to access the elements currently visible on the grid widget. I've tried using model.currentViewData but it maintains the original loaded json so when an element get removed from the grid the currentViewData does not remove the corresponding element unless a server update is triggered.

Is there a better approach to monitor the currently visible elements on the grid?

Kind Regards,

[Sathyanarayanamoorthy Eswararao]

Hi Islam, 

Thanks for contacting Syncfusion support. 

The model.currentViewData and the content table of the grid will be updated only after saving the changes made in the records. This is the default behavior of the Batch Editing. If you need the Deleted rows details before saving then the deleted rows can be obtained using getBatchChanges() method of grid. 

Please refer the below documentation for the details of  getBatchChanges() method. 

https://help.syncfusion.com/api/js/ejgrid#methods:getbatchchanges 

Also can you please share the purpose of getting the currently visible items in the grid so that we can provide appropriate solution as per your requirement. 

If you need any further assistance please get back to us. 

Regards, 

Sathyanarayanamoorthy 

[Islam yahia]

HI Sathyanarayanamoorthy,

Thanks for your reply.

I have a summary that counts the total of a specific column and I want to update that summary immediately with every batch update before it gets sent back to the server, and it seems there is no straightforward way to achieve this using the standard summary column and I would be happy if you could give me a hint on how to use the getBatchChanges to achieve this.

Kind Regards,

[Sathyanarayanamoorthy Eswararao]

Hi Islam, 

Query: I have a summary that counts the total of a specific column and I want to update that summary immediately with every batch update before it gets sent back to the server 

 

We have achieved this requirement in the below code example using beforeBatchDelete event. Please refer the below documentations. 

API Link: https://help.syncfusion.com/api/js/ejgrid#events:beforebatchdelete  

https://help.syncfusion.com/api/js/ejgrid#methods:getcolumnindexbyfield 

Refer the below code example. 

 

<script type="text/javascript"> 

        $(function () { 

            var data = window.gridData; 

            $("#Grid").ejGrid({ 

                                       …... 

                summaryRows: [ 

                        { title: "Sum", summaryColumns: [{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "Freight", dataMember: "Freight", format: "{0:C2}" }] } 

                    ], 

                  

                columns: [ 

                        { field: "OrderID", isPrimaryKey: true, headerText: "Order ID"}, 

                         …... 

 

                        { field: "Freight" }, 

                ], 

                beforeBatchDelete: "del" 

            }); 

        }); 

    </script> 

 

<script type="text/javascript"> 

    function del(args) { 

            var  format; 

            var removedvalue = args.rowData.Freight;// getting the old 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"){ 

                        format = !ej.isNullOrUndefined(this.model.summaryRows[i].summaryColumns[j].format) ? this.model.summaryRows[i].summaryColumns[j].format : "{0:N}";//getting the format of the summaryColumn 

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

                        break; 

                } 

            } 

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

            var summaryval = (parseFloat(summary) - removedvalue); 

            summaryval = this.formatting(format,summaryval);//get the formatted value of the summary Value 

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

        } 

      

</script> 

We have prepared an online sample for your reference which can be referred from the below link. 

Sample: http://jsplayground.syncfusion.com/t1qri5ud  

If you need any further assistance please get back to us. 

Regards, 

Sathyanarayanamoorthy