[CLOSED] Gridpanel Filter and Recalculate Column Totals

  1. #1

    [CLOSED] Gridpanel Filter and Recalculate Column Totals

    Hi,

    I?ve got a gridpanel which I?ve successfully calculated the total of 3 columns. What I?d like to do when a column is filtered is re-calculate the column totals based on the filtered results. I pass the gridpanel in as a parameter to the javascript. Do I need to put a listener on the filter?

    Javascript:

    var UpdateTotal = function (grid) {
        var fbar = grid.getBottomToolbar(),
                    column,
                    field,
                    width,
                    data = { Total: 0, VAT: 0, GrossTotal: 0, Payments: 0, Balance: 0 },
                    c,
                    cs = grid.view.getColumnData();
     
        var currencySymbol = "";
     
        //Iterate over the store data
        for (var j = 0, jlen = grid.store.getCount(); j < jlen; j++) {
            var r = grid.store.getAt(j);
            if (j == 0) {
                currencySymbol = r.data.CurrencySymbol;
            }
     
            for (var i = 0, len = cs.length; i < len; i++) {
                c = cs[i];
                data[c.name] += r.get(c.name);
            }
        }
     
        //Iterate over the columns
        for (var i = 0; i < grid.getColumnModel().columns.length; i++) {
            column = grid.getColumnModel().columns[i];
     
            field = fbar.findBy(function (item) {
                return item.dataIndex === column.dataIndex;
            })[0];
     
            if (field != undefined) {
                c = cs[i];
                fbar.remove(field, false);
                fbar.insert(i, field);
                width = grid.getColumnModel().getColumnWidth(i);
                field.setWidth(width - 5);
                if (isNaN(data[c.name]))
                    field.setValue("&nbsp;");
                else
                    if (data[c.name].toFixed(2) >= 0)
                        field.setValue(currencySymbol + data[c.name].toFixed(2));
                    else
                        field.setValue("&nbsp;");
                }
        }
     
        fbar.doLayout();
    };
    Store / Gridpanel:

    <ext:Store
                ID="storeRentDemandLandlordFees" 
                runat="server">
                <Reader>
                    <ext:JsonReader>
                        <Fields>
                            <ext:RecordField Name="Fee" />
                            <ext:RecordField Name="Landlord" />
                            <ext:RecordField Name="Total" />
                            <ext:RecordField Name="VAT" />
                            <ext:RecordField Name="GrossTotal" />
                            <ext:RecordField Name="CurrencySymbol" />
                            <ext:RecordField Name="IsPaid" />
                        </Fields>
                    </ext:JsonReader>
                </Reader>
            </ext:Store> 
     
     
    <ext:GridPanel ID="gridPanelRentDemandLandlordFees" runat="server" StoreID="storeRentDemandLandlordFees" AutoHeight="true" AutoWidth="true" EnableColumnHide="false">
                    <ColumnModel ID="columnModelrentDemandLandlordFees" runat="server">
                        <Columns>
                            <ext:Column ColumnID="FeeName" Header="Fee" DataIndex="Fee" Width="125" />
                            <ext:Column ColumnID="Landlord" Header="Landlord" DataIndex="Landlord" />
                            <ext:Column ColumnID="Amount" Header="Amount" DataIndex="Total" Align="Right">
                                <Renderer Fn="FormatAsMoney" />
                            </ext:Column>
                            <ext:Column ColumnID="VAT" Header="VAT" DataIndex="VAT" Align="Right">
                                <Renderer Fn="FormatAsMoney" />
                            </ext:Column>
                            <ext:Column ColumnID="Total" Header="Total" DataIndex="GrossTotal" Align="Right">
                                <Renderer Fn="FormatAsMoney" />
                            </ext:Column>
                        </Columns>
                    </ColumnModel>
                    <BottomBar>
                        <ext:Toolbar runat="server">
                            <Items>
                                <ext:DisplayField ID="dfFeeName" runat="server" DataIndex="Fee" Cls="total-field" />
                                <ext:DisplayField ID="dfLandlord" runat="server" DataIndex="Landlord" Cls="total-field" />
                                <ext:DisplayField ID="dfAmount" runat="server" DataIndex="Total" Cls="total-field" />
                                <ext:DisplayField ID="dfVAT" runat="server" DataIndex="VAT" Cls="total-field" />
                                <ext:DisplayField ID="dfTotal" runat="server" DataIndex="GrossTotal" Cls="total-field" />
                            </Items>
                        </ext:Toolbar>
                    </BottomBar>
                    <Plugins>
                    <ext:GridFilters runat="server" ID="GridFiltersLandlordFees" Local="true">
                        <Filters>
                            <ext:StringFilter DataIndex="Fee" />
                            <ext:StringFilter DataIndex="Landlord" />
                        </Filters>
                    </ext:GridFilters>
                </Plugins>
                </ext:GridPanel>
    Thanks in advance.

    Ian
    Last edited by Daniil; Feb 27, 2012 at 10:26 AM. Reason: [CLOSED]
  2. #2
    Hi,

    Filtering causes the Store DataChanged event to be fired. I would listen that event to update the total row.

Similar Threads

  1. Replies: 2
    Last Post: May 01, 2012, 4:57 PM
  2. Replies: 8
    Last Post: Sep 13, 2011, 8:47 PM
  3. [CLOSED] Add totals to gridpanel without grouping
    By Pablo_Azevedo in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 19, 2011, 12:08 PM
  4. [CLOSED] GridPanel Multi column filter
    By kenanhancer in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Apr 21, 2011, 2:22 PM
  5. Calculate Totals in GridPanel
    By simonmicheal in forum 1.x Help
    Replies: 1
    Last Post: Aug 01, 2009, 3:39 PM

Tags for this Thread

Posting Permissions