javascriptextjsextjs-grid

Ext Js Grid, How to get particular column all row values & sum?


I'm using Ext Js v6.2 Grid, In my application, I have three columns Charges, Rate & Amount Here I want to get all the value of third column [AMOUNT] & Sum it up.please correct my code if I'm wrong, I've searched in documentation and other stuff it doesn't help.please solve the problem. Thanks in advance.

                         editor: {
                                    xtype: 'textfield',
                                    enableKeyEvents: true,
                                    fieldCls: 'right-align',

                        listeners: {
                                     element: 'el',
                         keyup: function(form, e, selModel, record, index, options){

                             var InputValue= document.getElementById(e.id).value;
                             var result = (productValue) * (InputValue) / 100;
                             var selectedRecord = gridStore.getSelection()[0];
                             rowindex = gridStore.store.indexOf(selectedRecord);
                             var models = gridStore.getStore().getRange();
                             models[rowindex].set("amount", result);
                             TotalOtherCharge = $('.Amount-column-cell .x-grid-cell-inner').text();
                             alert(TotalOtherCharge);


                        } 
                    }
                },

I'm getting output from TotalOtherCharge

As per Screenshot:

2.862.8614.322.885.722.862.865.728.5811.442.86 I need these number to split & sum it up.

GRID SCREENSHOT


Solution

  • I believe this functionality is already included in 6.2 grids: http://docs.sencha.com/extjs/6.2.0/classic/Ext.grid.feature.Summary.html

    also here is an example from sencha fiddle:

    https://fiddle.sencha.com/#view/editor&fiddle/1u6j