What's New?

[CLOSED] summary column for gridpanel?

  1. #1
    Feb 23, 2011, 5:07 PM

    [CLOSED] summary column for gridpanel?

    Hi:

    I am a newbie for ext.net. The current project need a summary column in a gridpanel and will auto-update after render and editing.

    For example:

    we have a grid with three column

    Value1: Value2: Value3
    we bind the value from store:

    Value1: Value2: Value3
     1           1         1
     2           2         2
     3           3         3
    Now I need a Totle column to auto-calculate the sum of row, like

    Value1: Value2: Value3: Total
     1           1         1       3
     2           2         2       6
     3           3         3       9
    Any ideas to implement it in client-side?

    thanks indeed.
    Last edited by Daniil; Feb 25, 2011 at 8:34 AM. Reason: [CLOSED]
  2. #2
    Feb 23, 2011, 5:43 PM
    Hi,

    Please look at the simple example how it can look.

    Example
    <%@ Page Language="C#" %>

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

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            Store store = this.GridPanel1.GetStore();
            store.DataSource = new object[] 
            { 
                new object[] { 1, 2, 3 },
                new object[] { 4, 5, 6 },
                new object[] { 7, 8, 9 }
            };
            store.DataBind();
        }
    }
</script>

<!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 runat="server">
    <title>Ext.Net Example</title>

    <script type="text/javascript">
        var myRenderer = function (value, metadata, record) {
            metadata.css = "my-class";
            return record.data.test1 + record.data.test2 + record.data.test3;
        }
    </script>

    <style type="text/css">
        .my-class {
            background: grey;
        }
    </style>
</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
        <Store>
            <ext:Store runat="server">
                <Reader>
                    <ext:ArrayReader>
                        <Fields>
                            <ext:RecordField Name="test1" />
                            <ext:RecordField Name="test2" />
                            <ext:RecordField Name="test3" />
                        </Fields>
                    </ext:ArrayReader>
                </Reader>
            </ext:Store>
        </Store>
        <ColumnModel runat="server">
            <Columns>
                <ext:Column Header="1" DataIndex="test1" />
                <ext:Column Header="2" DataIndex="test2" />
                <ext:Column Header="3" DataIndex="test3" />
                <ext:Column Header="Total" DataIndex="total">
                    <Renderer Fn="myRenderer" />
                </ext:Column>
            </Columns>
        </ColumnModel>
    </ext:GridPanel>
    </form>
</body>
</html>

    See also
    http://dev.sencha.com/deploy/dev/doc...ember=renderer //more info about renderer

    Examples (more complex than mine)
    https://examples1.ext.net/#/GridPane...oupingSummary/
    https://examples1.ext.net/#/GridPane...ping_TotalRow/
    https://examples1.ext.net/#/GridPane...HybridSummary/
  3. #3
    Feb 24, 2011, 12:00 PM
    That works perfect. Thank you indeed.
    How about auto-update total column?

    if I edit any cell like change value from 6 to 10, how could I auto-update the total column regarding the edit.

    Thank you
  4. #4
    Feb 24, 2011, 12:10 PM
    Hi,

    If you edit cell then summary column recalculates own value automatically
  5. #5
    Feb 25, 2011, 8:01 AM
    That's perfect. Thank you

Similar Threads

  1. [CLOSED] [Razor] Summary column don't show sum
    By boris in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: Jul 10, 2012, 2:51 PM
  2. Grid Panel Summary Column
    By Mina in forum 1.x Help
    Replies: 3
    Last Post: Jan 02, 2012, 9:03 AM
  3. Grid Column Summary Plugin?
    By huzzy143 in forum 1.x Help
    Replies: 10
    Last Post: Aug 10, 2011, 5:19 PM
  4. [CLOSED] Grid Editor with Summary in data column [1.0]
    By pdcase in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Mar 07, 2011, 9:13 AM
  5. Autowrap Grouping Summary Column
    By sachin.munot in forum 1.x Help
    Replies: 1
    Last Post: Nov 23, 2009, 1:04 AM

Posting Permissions