What's New?

[CLOSED] Is it possible to find the sum of the column values in the last row of grid?

Page 1 of 2 12 LastLast
  1. #1
    Oct 05, 2009, 4:11 AM

    [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    Is it possible to find the sum of the column values in the last row of grid?
  2. #2
    Oct 05, 2009, 5:47 AM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    Please provide more details.

    Do you need calculate the sum of column and add it to the last row?
  3. #3
    Oct 05, 2009, 7:28 AM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    I need to calculate the sum of column and add it to the last row.For clarification see the screen shot.
  4. #4
    Oct 05, 2009, 10:15 AM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    Please see the following sample
    <%@ Page Language="C#" %>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Ext.IsAjaxRequest)
        {
            this.Store1.DataSource = new object[]
            {
                new object[] {"3m Co", 71.72},
                new object[] {"Alcoa Inc", 29.01},
                new object[] {"Altria Group Inc", 83.81},
                new object[] {"American Express Company", 52.55},
                new object[] {"American International Group, Inc.", 64.13}
            };

            this.Store1.DataBind();
        }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    
    <script type="text/javascript">
        var initSummaryRecord = function(){
            var r = this.addRecord().record;
            r.isSummary = true;
            calculate(this, 'price');
        }
        
        var calculate = function(store, field){
            var sum = 0,
                summaryRecord;
            store.each(function(r){
                if(r.isSummary){                    
                    summaryRecord = r;
                    return;
                }
                sum += r.get(field);
            });
            
            summaryRecord.set(field, sum);
            summaryRecord.commit();
        }
        
        var priceRenderer = function(value, meta, r){
            var s = Ext.util.Format.usMoney(value);
            if(r.isSummary){
                s = ""+s+"";
            }
            
            return s;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" />
        
        <ext:Store ID="Store1" runat="server">
            <Reader>
                <ext:ArrayReader>
                    <Fields>
                        <ext:RecordField Name="company" />
                        <ext:RecordField Name="price" Type="Float" />
                    </Fields>
                </ext:ArrayReader>
            </Reader>
            
            <Listeners>
                <Load Fn="initSummaryRecord" />
            </Listeners>
        </ext:Store>
        
        <ext:GridPanel 
            ID="GridPanel1" 
            runat="server" 
            StoreID="Store1" 
            Title="Grid" 
            Width="600" 
            Height="350"
            AutoExpandColumn="Company">
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column ColumnID="Company" Header="Company" Sortable="true" DataIndex="company" />
                    <ext:Column Header="Price" Sortable="true" DataIndex="price">
                        <Renderer Fn="priceRenderer" />
                        <Editor>
                            <ext:NumberField runat="server" />
                        </Editor>
                    </ext:Column>                    
                </Columns>
            </ColumnModel>
            <SelectionModel>
                <ext:RowSelectionModel runat="server" SingleSelect="true" />
            </SelectionModel>
            
            <Listeners>
                <BeforeEdit Handler="return e.record.isSummary !== true;" />
                <AfterEdit Handler="calculate(this.store,'price');" />
            </Listeners>
        </ext:GridPanel>          
    </form>
</body>
</html>
  5. #5
    Oct 05, 2009, 10:59 AM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    It is fine.I need the sum of one more column.I added one more column price one to above sample.But it is not working.See the sample and tell me where i missed.

    <%@ Page Language="C#">

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Ext.IsAjaxRequest)
        {
            this.Store1.DataSource = new object[]
            {
                new object[] {"3m Co", 71.72, 11.72},
                new object[] {"Alcoa Inc", 29.01, 21.72},
                new object[] {"Altria Group Inc", 83.81, 31.72},
                new object[] {"American Express Company", 52.55, 41.72},
                new object[] {"American International Group, Inc.", 64.13, 51.72}
            };

            this.Store1.DataBind();
        }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

    <script type="text/javascript">
        var initSummaryRecord = function() {
            var r = this.addRecord().record;
            r.isSummary = true;
            calculate(this, 'price');
        }
        var calculate = function(store, field) {
            var sum = 0,
                summaryRecord;
            store.each(function(r) {
                if (r.isSummary) {
                    summaryRecord = r;
                    return;
                }
                sum += r.get(field);
            });

            summaryRecord.set(field, sum);
            summaryRecord.commit();
        }

        var priceRenderer = function(value, meta, r) {
            var s = Ext.util.Format.usMoney(value);
            if (r.isSummary) {
                s = "" + s + "";
            }

            return s;
        }

       
        
    </script>
<script type="text/javascript">
    var initSummaryRecord1 = function() {
        var r = this.addRecord().record;
        r.isSummary = true;
        calculate(this, 'price1');
    }
    var calculate = function(store, field) {
        var sum = 0,
                summaryRecord;
        store.each(function(r) {
            if (r.isSummary) {
                summaryRecord = r;
                return;
            }
            sum += r.get(field);
        });

        summaryRecord.set(field, sum);
        summaryRecord.commit();
    }

    var priceRenderer1 = function(value, meta, r) {
        var s = Ext.util.Format.usMoney(value);
        if (r.isSummary) {
            s = "" + s + "";
        }

        return s;
    }

       
        
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ScriptManager ID="ScriptManager1" runat="server" />
    <ext:Store ID="Store1" runat="server">
        <Reader>
            <ext:ArrayReader>
                <Fields>
                    <ext:RecordField Name="company" />
                    <ext:RecordField Name="price" Type="Float" />
                    <ext:RecordField Name="price1" Type="Float" />
                </Fields>
            </ext:ArrayReader>
        </Reader>
        <Listeners>
            <Load Fn="initSummaryRecord" />
        </Listeners>
    </ext:Store>
    <ext:GridPanel ID="GridPanel1" runat="server" StoreID="Store1" Title="Grid" Width="600"
        Height="350" AutoExpandColumn="Company">
        <ColumnModel ID="ColumnModel1" runat="server">
            <Columns>
                <ext:Column ColumnID="Company" Header="Company" Sortable="true" DataIndex="company" />
                <ext:Column Header="Price" Sortable="true" DataIndex="price">
                    <Renderer Fn="priceRenderer" />
                    <Editor>
                        <ext:NumberField ID="NumberField1" runat="server" />
                    </Editor>
                </ext:Column>
                <ext:Column Header="Price1" Sortable="true" DataIndex="price1">
                    <Renderer Fn="priceRenderer1" />
                    <Editor>
                        <ext:NumberField ID="NumberField2" runat="server" />
                    </Editor>
                </ext:Column>
            </Columns>
        </ColumnModel>
        <SelectionModel>
            <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
        </SelectionModel>
        <Listeners>
            <BeforeEdit Handler="return e.record.isSummary !== true;" />
            <AfterEdit Handler="calculate(this.store,'price');" />
            <AfterEdit Handler="calculate(this.store,'price1');" />
        </Listeners>
    </ext:GridPanel>
    </form>
</body>
</html>
  6. #6
    Oct 05, 2009, 11:07 AM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    Please do not duplicate Liateners (only one handler can be, just combine your script in one handler). Also you need to update 'initSummaryRecord' function to recalculate 'price1'

    I updated example, please see the following code
    <%@ Page Language="C#" %>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Ext.IsAjaxRequest)
        {
            this.Store1.DataSource = new object[]
            {
                new object[] {"3m Co", 71.72, 11.72},
                new object[] {"Alcoa Inc", 29.01, 21.72},
                new object[] {"Altria Group Inc", 83.81, 31.72},
                new object[] {"American Express Company", 52.55, 41.72},
                new object[] {"American International Group, Inc.", 64.13, 51.72}
            };

            this.Store1.DataBind();
        }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    
    <script type="text/javascript">
        var initSummaryRecord = function(){
            var r = this.addRecord().record;
            r.isSummary = true;
            calculate(this, ['price', 'price1']);
        }
        
        var calculate = function(store, field){
            if(Ext.isArray(field)){
                for(var i=0;i<field.length;i++){
                    calculate(store,field[i]);
                }
                return;
            }
            var sum = 0,
                summaryRecord;
            store.each(function(r){
                if(r.isSummary){                    
                    summaryRecord = r;
                    return;
                }
                sum += r.get(field);
            });
            
            summaryRecord.set(field, sum);
            summaryRecord.commit();
        }
        
        var priceRenderer = function(value, meta, r){
            var s = Ext.util.Format.usMoney(value);
            if(r.isSummary){
                s = ""+s+"";
            }
            
            return s;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" />
        
        <ext:Store ID="Store1" runat="server">
            <Reader>
                <ext:ArrayReader>
                    <Fields>
                        <ext:RecordField Name="company" />
                        <ext:RecordField Name="price" Type="Float" />
                        <ext:RecordField Name="price1" Type="Float" />
                    </Fields>
                </ext:ArrayReader>
            </Reader>
            
            <Listeners>
                <Load Fn="initSummaryRecord" />
            </Listeners>
        </ext:Store>
        
        <ext:GridPanel 
            ID="GridPanel1" 
            runat="server" 
            StoreID="Store1" 
            Title="Grid" 
            Width="600" 
            Height="350"
            AutoExpandColumn="Company">
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column ColumnID="Company" Header="Company" Sortable="true" DataIndex="company" />
                    <ext:Column Header="Price" Sortable="true" DataIndex="price">
                        <Renderer Fn="priceRenderer" />
                        <Editor>
                            <ext:NumberField runat="server" />
                        </Editor>
                    </ext:Column>                    
                    <ext:Column Header="Price1" Sortable="true" DataIndex="price1">
                        <Renderer Fn="priceRenderer" />
                        <Editor>
                            <ext:NumberField runat="server" />
                        </Editor>
                    </ext:Column>   
                </Columns>
            </ColumnModel>
            <SelectionModel>
                <ext:RowSelectionModel runat="server" SingleSelect="true" />
            </SelectionModel>
            
            <Listeners>
                <BeforeEdit Handler="return e.record.isSummary !== true;" />
                <AfterEdit Handler="if(['price','price1'].indexOf(e.field) !== -1){calculate(this.store,e.field);}" />
            </Listeners>
        </ext:GridPanel>          
    </form>
</body>
</html>
  7. #7
    Oct 05, 2009, 12:27 PM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    Is it possible to show the sum of column values in last row+1. that means if grid contains 5 i want sum in the 7 row.if grid contains 6 rows i need sum in 8 th row and so on,because i need to add the rows dynamically and also I need to show the sum.

    Hi see the sample it is not binding correctly.It is working fine if i delete the sum related line.

    Desing page.

    <%@ Page Language="C#">

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

    <script type="text/javascript">
        var getFunctionName = function(value) {
            if (value != "")
                return storFunction.getById(value).data.FunctionTitle;
            else
                return "";
        };
        
    </script>

    <script type="text/javascript">
        var initSummaryRecord = function() {
            var r = this.addRecord().record;
            r.isSummary = true;
            calculate(this, ['price']);
        }

        var calculate = function(store, field) {
            if (Ext.isArray(field)) {
                for (var i = 0; i < field.length; i++) {
                    calculate(store, field[i]);
                }
                return;
            }
            var sum = 0,
                summaryRecord;
            store.each(function(r) {
                if (r.isSummary) {
                    summaryRecord = r;
                    return;
                }
                sum += r.get(field);
            });

            summaryRecord.set(field, sum);
            summaryRecord.commit();
        }

        var priceRenderer = function(value, meta, r) {
            var s = Ext.util.Format.usMoney(value);
            if (r.isSummary) {
                s = "" + s + "";
            }

            return s;
        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <ext:ScriptManager ID="scm" runat="server">
    </ext:ScriptManager>
    <ext:Store ID="storFunction" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="FunctionId">
                <Fields>
                    <ext:RecordField Name="FunctionId" Type="Int" />
                    <ext:RecordField Name="FunctionTitle" Type="String" />
                </Fields>
            </ext:JsonReader>
        </Reader>
        <Listeners>
            <Load Handler="var o = gpEmp.addRecordEx();o.record.firstEdit=false;" Delay="100" />
        </Listeners>
    </ext:Store>
    <ext:Store ID="storEmp" runat="server">
        <Reader>
            <ext:ArrayReader>
                <Fields>
                    <ext:RecordField Name="ID" Type="Int" />
                    <ext:RecordField Name="Time" Type="string" />
                    <ext:RecordField Name="ChangeType" Type="Int" />
                    <ext:RecordField Name="price" Type="Float" />
                </Fields>
            </ext:ArrayReader>
        </Reader>
        <Listeners>
            <Load Fn="initSummaryRecord" />
        </Listeners>
    </ext:Store>
    <ext:ViewPort runat="server" ID="parentPanel">
        <Body>
            <ext:BorderLayout ID="BL" runat="Server">
                <Center>
                    <ext:Panel ID="pnl" runat="Server" Border="false">
                        <Body>
                            <ext:GridPanel runat="server" ID="gpEmp" AutoHeight="False" StoreID="storEmp" Floating="true"
                                Border="true" BodyBorder="true" Header="true" Height="200">
                                <ColumnModel ID="ColumnModel1" runat="server">
                                    <Columns>
                                        <ext:Column DataIndex="ID" Header="Id" Width="150">
                                            <Renderer Fn="getFunctionName" />
                                            <Editor>
                                                <ext:ComboBox ID="cbDepartments" CtCls="cntrlFont" ListClass="cntrlFont" ReadOnly="true"
                                                    runat="server" StoreID="storFunction" DisplayField="FunctionTitle" ValueField="FunctionId"
                                                    Mode="Local" AutoPostBack="False" Select&#111;nfocus="true" ForceSelection="True"
                                                    TriggerAction="All" />
                                            </Editor>
                                        </ext:Column>
                                        <ext:Column DataIndex="Time" Header="Time">
                                            <Editor>
                                                <ext:TimeField ID="TimeField1" Editable="false" runat="server">
                                                </ext:TimeField>
                                            </Editor>
                                        </ext:Column>
                                        <ext:CheckColumn DataIndex="ChangeType" Hidden="true" Editable="true" Header="ChangeType"
                                            Width="150">
                                        </ext:CheckColumn>
                                        <ext:Column Header="Price" Sortable="true" DataIndex="price">
                                            <Renderer Fn="priceRenderer" />
                                            <Editor>
                                                <ext:NumberField ID="NumberField1" runat="server" />
                                            </Editor>
                                        </ext:Column>
                                    </Columns>
                                </ColumnModel>
                                <SelectionModel>
                                    <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
                                </SelectionModel>
                                <Listeners>
                                    <BeforeEdit Handler="return e.record.isSummary !== true;" />
                                    <AfterEdit Handler="e.record.set('ChangeType', true);if(e.row == (e.grid.store.getCount()-1)){var o = e.grid.addRecordEx();o.record.firstEdit=false;};calculate(this.store,'price');" />
                                </Listeners>
                                <AjaxEvents>
                                </AjaxEvents>
                            </ext:GridPanel>
                        </Body>
                    </ext:Panel>
                </Center>
            </ext:BorderLayout>
        </Body>
    </ext:ViewPort>
    </form>
</body>
</html>
    and code page is
    using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

using Coolite.Ext.Web;
using System.Data;
using System.Xml;
public partial class GridWithSum : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Ext.IsAjaxRequest)
        {
            FillEmpData();
            FillFunctonStor();
        }
    }
    private void FillEmpData()
    {
        DataTable dtEmp = new DataTable();
        dtEmp.Columns.Add("ID");
        dtEmp.Columns.Add("Time");
        dtEmp.Columns.Add("ChangeType");
        dtEmp.Columns.Add("price");
        DataRow dr;
        for (int i = 0; i < 10; i++)
        {
            dr = dtEmp.NewRow();
            dr[0] = i.ToString();
            dr[1] = "EmpName" + i.ToString();
            dr[2] = "0";
            dr[3] =i;
            dtEmp.Rows.Add(dr);
        }
        storEmp.DataSource = dtEmp;
        storEmp.DataBind();

    }
    private void FillFunctonStor()
    {
        DataSet dsFunction = new DataSet();
        DataTable dt = new DataTable();
        dt.Columns.Add("FunctionId");
        dt.Columns.Add("FunctionTitle");
        DataRow dr;
        for (int i = 0; i < 10; i++)
        {
            dr = dt.NewRow();
            dr[0] = i.ToString();
            dr[1] = "E" + i.ToString();
            dt.Rows.Add(dr);
        }
        dsFunction.Tables.Add(dt);
        storFunction.DataSource = dsFunction;
        storFunction.DataBind();

    }
}
  8. #8
    Oct 05, 2009, 1:36 PM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    See the following sample
    <%@ Page Language="C#"%>
<%@ Import Namespace="System.Data"%>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

    <script type="text/javascript">
        var getFunctionName = function(value) {
            if (value !== "")
                return storFunction.getById(value).data.FunctionTitle;
            else
                return "";
        };
        
    </script>

    <script type="text/javascript">
        var initSummaryRecord = function(store) {
            var r = store.addRecord().record;
            r.isSummary = true;
            calculate(store, ['price']);
        }

        var calculate = function(store, field) {
            if (Ext.isArray(field)) {
                for (var i = 0; i < field.length; i++) {
                    calculate(store, field[i]);
                }
                return;
            }
            var sum = 0,
                v,
                summaryRecord;
            store.each(function(r) {
                if (r.isSummary) {
                    summaryRecord = r;
                    return;
                }
                v = r.get(field);
                if(Ext.isEmpty(v,false)){
                    v=0;
                }
                sum += v;
            });

            summaryRecord.set(field, sum);
            summaryRecord.commit();
        }

        var priceRenderer = function(value, meta, r) {
            var s = Ext.util.Format.usMoney(value);
            if (r.isSummary) {
                s = "" + s + "";
            }

            return s;
        }
    </script>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Ext.IsAjaxRequest)
            {
                FillEmpData();
                FillFunctonStor();
            }
        }
        
        private void FillEmpData()
        {
            DataTable dtEmp = new DataTable();
            dtEmp.Columns.Add("ID");
            dtEmp.Columns.Add("Time");
            dtEmp.Columns.Add("ChangeType");
            dtEmp.Columns.Add("price");
            DataRow dr;
            for (int i = 0; i < 10; i++)
            {
                dr = dtEmp.NewRow();
                dr[0] = i.ToString();
                dr[1] = "EmpName" + i.ToString();
                dr[2] = "0";
                dr[3] =i;
                dtEmp.Rows.Add(dr);
            }
            storEmp.DataSource = dtEmp;
            storEmp.DataBind();

        }
        
        private void FillFunctonStor()
        {
            DataSet dsFunction = new DataSet();
            DataTable dt = new DataTable();
            dt.Columns.Add("FunctionId");
            dt.Columns.Add("FunctionTitle");
            DataRow dr;
            for (int i = 0; i < 10; i++)
            {
                dr = dt.NewRow();
                dr[0] = i.ToString();
                dr[1] = "E" + i.ToString();
                dt.Rows.Add(dr);
            }
            dsFunction.Tables.Add(dt);
            storFunction.DataSource = dsFunction;
            storFunction.DataBind();

        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <ext:ScriptManager ID="scm" runat="server">
    </ext:ScriptManager>
    
    <ext:Store ID="storFunction" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="FunctionId">
                <Fields>
                    <ext:RecordField Name="FunctionId" Type="Int" />
                    <ext:RecordField Name="FunctionTitle" Type="String" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    
    <ext:Store ID="storEmp" runat="server">
        <Reader>
            <ext:JsonReader>
                <Fields>
                    <ext:RecordField Name="ID" Type="Int" />
                    <ext:RecordField Name="Time" Type="string" />
                    <ext:RecordField Name="ChangeType" Type="Int" />
                    <ext:RecordField Name="price" Type="Float" />
                </Fields>
            </ext:JsonReader>
        </Reader>
        <Listeners>
            <Load Handler="var o = gpEmp.addRecordEx();o.record.firstEdit=false;initSummaryRecord(this);" />
        </Listeners>
    </ext:Store>
    
    <ext:ViewPort runat="server" ID="parentPanel">
        <Body>
            <ext:BorderLayout ID="BL" runat="Server">
                <Center>
                    <ext:Panel ID="pnl" runat="Server" Border="false">
                        <Body>
                            <ext:GridPanel runat="server" ID="gpEmp" AutoHeight="False" StoreID="storEmp" Floating="true"
                                Border="true" BodyBorder="true" Header="true" Height="200">
                                <ColumnModel ID="ColumnModel1" runat="server">
                                    <Columns>
                                        <ext:Column DataIndex="ID" Header="Id" Width="150">
                                            <Renderer Fn="getFunctionName" />
                                            <Editor>
                                                <ext:ComboBox ID="cbDepartments" CtCls="cntrlFont" ListClass="cntrlFont" ReadOnly="true"
                                                    runat="server" StoreID="storFunction" DisplayField="FunctionTitle" ValueField="FunctionId"
                                                    Mode="Local" AutoPostBack="False" Select&#111;nfocus="true" ForceSelection="True"
                                                    TriggerAction="All" />
                                            </Editor>
                                        </ext:Column>
                                        <ext:Column DataIndex="Time" Header="Time">
                                            <Editor>
                                                <ext:TimeField ID="TimeField1" Editable="false" runat="server">
                                                </ext:TimeField>
                                            </Editor>
                                        </ext:Column>
                                        <ext:CheckColumn DataIndex="ChangeType" Hidden="true" Editable="true" Header="ChangeType"
                                            Width="150">
                                        </ext:CheckColumn>
                                        <ext:Column Header="Price" Sortable="true" DataIndex="price">
                                            <Renderer Fn="priceRenderer" />
                                            <Editor>
                                                <ext:NumberField ID="NumberField1" runat="server" />
                                            </Editor>
                                        </ext:Column>
                                    </Columns>
                                </ColumnModel>
                                <SelectionModel>
                                    <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
                                </SelectionModel>
                                <Listeners>
                                    <BeforeEdit Handler="return e.record.isSummary !== true;" />
                                    <AfterEdit Handler="e.record.set('ChangeType', true);if(e.row == (e.grid.store.getCount()-2)){var r = e.grid.insertRecord(e.grid.store.getCount()-1, {});r.firstEdit=false;};calculate(this.store,'price');" />
                                </Listeners>
                                <AjaxEvents>
                                </AjaxEvents>
                            </ext:GridPanel>
                        </Body>
                    </ext:Panel>
                </Center>
            </ext:BorderLayout>
        </Body>
    </ext:ViewPort>
    </form>
</body>
</html>
  9. #9
    Oct 06, 2009, 10:55 AM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    It is working fine,but the problem is if i sort the any column the null row and sum row are also sorting,how to avoid the sorting of these two rows(Sum row and the empty row).

    At least i don't want to sort the last row(i,e sum row);
  10. #10
    Oct 07, 2009, 4:52 AM

    RE: [CLOSED] Is it possible to find the sum of the column values in the last row of grid?

    Hi,

    Listen SortChanges event of Grid and move those rows to the bottom

    <%@ Page Language="C#"%>
<%@ Import Namespace="System.Data"%>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

    <script type="text/javascript">
        var getFunctionName = function(value) {
            if (value !== "")
                return storFunction.getById(value).data.FunctionTitle;
            else
                return "";
        };
        
    </script>
    
    <ext:ScriptContainer runat="server" />

    <script type="text/javascript">
        var initSummaryRecord = function(store) {
            var r = store.addRecord().record;
            r.isSummary = true;
            calculate(store, ['price']);
        }
        
        var initNewRow = function(){
            var o = gpEmp.addRecordEx();
            o.record.firstEdit=false;
            o.record.lastRow=true;
            initSummaryRecord(this);
        }
        
        var afterEdit = function(e){
            e.record.set('ChangeType', true);
            
            if(e.row == (e.grid.store.getCount()-2)){
                e.record.lastRow = false;
                var r = e.grid.insertRecord(e.grid.store.getCount()-1, {});
                r.firstEdit=false;
                r.lastRow = true;
            }
            
            calculate(this.store,'price');
        }
        
        var sortChanges = function(grid){
            var sr,lr;
            
            grid.store.each(function(r, index) {
                if (r.isSummary) {
                    sr = r;
                    return;
                }
                
                if(r.lastRow){
                    lr = r;
                }
            });
            
            grid.store.remove(lr);
            grid.store.add(lr);
            
            grid.store.remove(sr);
            grid.store.add(sr);
        }

        var calculate = function(store, field) {
            if (Ext.isArray(field)) {
                for (var i = 0; i < field.length; i++) {
                    calculate(store, field[i]);
                }
                return;
            }
            var sum = 0,
                v,
                summaryRecord;
            store.each(function(r) {
                if (r.isSummary) {
                    summaryRecord = r;
                    return;
                }
                v = r.get(field);
                if(Ext.isEmpty(v,false)){
                    v=0;
                }
                sum += v;
            });

            summaryRecord.set(field, sum);
            summaryRecord.commit();
        }

        var priceRenderer = function(value, meta, r) {
            var s = Ext.util.Format.usMoney(value);
            if (r.isSummary) {
                s = "" + s + "";
            }

            return s;
        }
        
    </script>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Ext.IsAjaxRequest)
            {
                FillEmpData();
                FillFunctonStor();
            }
        }
        
        private void FillEmpData()
        {
            DataTable dtEmp = new DataTable();
            dtEmp.Columns.Add("ID");
            dtEmp.Columns.Add("Time");
            dtEmp.Columns.Add("ChangeType");
            dtEmp.Columns.Add("price");
            DataRow dr;
            for (int i = 0; i < 10; i++)
            {
                dr = dtEmp.NewRow();
                dr[0] = i.ToString();
                dr[1] = "EmpName" + i.ToString();
                dr[2] = "0";
                dr[3] =i;
                dtEmp.Rows.Add(dr);
            }
            storEmp.DataSource = dtEmp;
            storEmp.DataBind();

        }
        
        private void FillFunctonStor()
        {
            DataSet dsFunction = new DataSet();
            DataTable dt = new DataTable();
            dt.Columns.Add("FunctionId");
            dt.Columns.Add("FunctionTitle");
            DataRow dr;
            for (int i = 0; i < 10; i++)
            {
                dr = dt.NewRow();
                dr[0] = i.ToString();
                dr[1] = "E" + i.ToString();
                dt.Rows.Add(dr);
            }
            dsFunction.Tables.Add(dt);
            storFunction.DataSource = dsFunction;
            storFunction.DataBind();

        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <ext:ScriptManager ID="scm" runat="server">
    </ext:ScriptManager>
    
    <ext:Store ID="storFunction" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="FunctionId">
                <Fields>
                    <ext:RecordField Name="FunctionId" Type="Int" />
                    <ext:RecordField Name="FunctionTitle" Type="String" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    
    <ext:Store ID="storEmp" runat="server">
        <Reader>
            <ext:JsonReader>
                <Fields>
                    <ext:RecordField Name="ID" Type="Int" />
                    <ext:RecordField Name="Time" Type="string" />
                    <ext:RecordField Name="ChangeType" Type="Int" />
                    <ext:RecordField Name="price" Type="Float" />
                </Fields>
            </ext:JsonReader>
        </Reader>
        <Listeners>
            <Load Fn="initNewRow" />
        </Listeners>
    </ext:Store>
    
    <ext:ViewPort runat="server" ID="parentPanel">
        <Body>
            <ext:BorderLayout ID="BL" runat="Server">
                <Center>
                    <ext:Panel ID="pnl" runat="Server" Border="false">
                        <Body>
                            <ext:GridPanel runat="server" ID="gpEmp" AutoHeight="False" StoreID="storEmp" Floating="true"
                                Border="true" BodyBorder="true" Header="true" Height="400">
                                <ColumnModel ID="ColumnModel1" runat="server">
                                    <Columns>
                                        <ext:Column DataIndex="ID" Header="Id" Width="150">
                                            <Renderer Fn="getFunctionName" />
                                            <Editor>
                                                <ext:ComboBox ID="cbDepartments" CtCls="cntrlFont" ListClass="cntrlFont" ReadOnly="true"
                                                    runat="server" StoreID="storFunction" DisplayField="FunctionTitle" ValueField="FunctionId"
                                                    Mode="Local" AutoPostBack="False" Select&#111;nfocus="true" ForceSelection="True"
                                                    TriggerAction="All" />
                                            </Editor>
                                        </ext:Column>
                                        <ext:Column DataIndex="Time" Header="Time">
                                            <Editor>
                                                <ext:TimeField ID="TimeField1" Editable="false" runat="server">
                                                </ext:TimeField>
                                            </Editor>
                                        </ext:Column>
                                        <ext:CheckColumn DataIndex="ChangeType" Hidden="true" Editable="true" Header="ChangeType"
                                            Width="150">
                                        </ext:CheckColumn>
                                        <ext:Column Header="Price" Sortable="true" DataIndex="price">
                                            <Renderer Fn="priceRenderer" />
                                            <Editor>
                                                <ext:NumberField ID="NumberField1" runat="server" />
                                            </Editor>
                                        </ext:Column>
                                    </Columns>
                                </ColumnModel>
                                <SelectionModel>
                                    <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
                                </SelectionModel>
                                <Listeners>
                                    <BeforeEdit Handler="return e.record.isSummary !== true;" />
                                    <AfterEdit Fn="afterEdit" />
                                    <SortChange Fn="sortChanges" />
                                </Listeners>
                                
                            </ext:GridPanel>
                        </Body>
                    </ext:Panel>
                </Center>
            </ext:BorderLayout>
        </Body>
    </ext:ViewPort>
    </form>
</body>
</html>
Page 1 of 2 12 LastLast

Similar Threads

  1. [CLOSED] How to access Editable grid column values using javascript
    By rnachman in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Dec 18, 2011, 2:55 PM
  2. [CLOSED] Find Combobox store caller and Server-side values.
    By ljcorreia in forum 1.x Legacy Premium Help
    Replies: 8
    Last Post: May 04, 2011, 4:42 PM
  3. [CLOSED] How to find if dynamically added form input values have changed (v0.8 )
    By iansriley in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Aug 02, 2010, 1:30 PM
  4. How to find a value in GridPanel column?
    By flormariafr in forum 1.x Help
    Replies: 3
    Last Post: Jan 24, 2010, 5:12 AM
  5. [CLOSED] How to change grid column values dynamically?
    By Etisbew in forum 1.x Legacy Premium Help
    Replies: 11
    Last Post: Oct 19, 2009, 3:49 PM

Posting Permissions