[CLOSED] Gridpanel dynamic grouping

  1. #1

    [CLOSED] Gridpanel dynamic grouping

    Hi team,
    In page load if we give groupfiled to store then it is working fine but it is not working in button's direct event
    In button click we want to group the grid data based on given groupfield.
    How can we solve this ?

    Here is the sample code to reproduce the scenario

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Cresent.WorkSafeExt.Test" %>
    
    
    <!DOCTYPE html>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                this.Store1.DataSource = this.Data;
                this.Store1.DataBind();
            }
        }
        private object[] Data
        {
            get
            {
                return new object[]
                {
                    new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                    new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                    new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                    new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
                    new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
                    new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
                    new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
                    new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
                    new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" },
                    new object[] { "Exxon Mobil Corp", 68.1, -0.43, -0.64, "9/1 12:00am" },
                    new object[] { "General Electric Company", 34.14, -0.08, -0.23, "9/1 12:00am" },
                    new object[] { "General Motors Corporation", 30.27, 1.09, 3.74, "9/1 12:00am" },
                    new object[] { "Hewlett-Packard Co.", 36.53, -0.03, -0.08, "9/1 12:00am" },
                    new object[] { "Honeywell Intl Inc", 38.77, 0.05, 0.13, "9/1 12:00am" },
                    new object[] { "Intel Corporation", 19.88, 0.31, 1.58, "9/1 12:00am" },
                    new object[] { "International Business Machines", 81.41, 0.44, 0.54, "9/1 12:00am" },
                    new object[] { "Johnson & Johnson", 64.72, 0.06, 0.09, "9/1 12:00am" },
                    new object[] { "JP Morgan & Chase & Co", 45.73, 0.07, 0.15, "9/1 12:00am" },
                    new object[] { "McDonald\"s Corporation", 36.76, 0.86, 2.40, "9/1 12:00am" },
                    new object[] { "Merck & Co., Inc.", 40.96, 0.41, 1.01, "9/1 12:00am" },
                    new object[] { "Microsoft Corporation", 25.84, 0.14, 0.54, "9/1 12:00am" },
                    new object[] { "Pfizer Inc", 27.96, 0.4, 1.45, "9/1 12:00am" },
                    new object[] { "The Coca-Cola Company", 45.07, 0.26, 0.58, "9/1 12:00am" },
                    new object[] { "The Home Depot, Inc.", 34.64, 0.35, 1.02, "9/1 12:00am" },
                    new object[] { "The Procter & Gamble Company", 61.91, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "United Technologies Corporation", 63.26, 0.55, 0.88, "9/1 12:00am" },
                    new object[] { "Verizon Communications", 35.57, 0.39, 1.11, "9/1 12:00am" },
                    new object[] { "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "9/1 12:00am" }
                };
            }
        }
        protected void BTN_CLICK(object sender, DirectEventArgs e)
        {
            Column3.Show();
            Store1.GroupField = "price";
            this.Store1.DataSource = this.Data;
            this.Store1.DataBind();
        }
    </script>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" />
            <div>
                <ext:Viewport ID="Viewport1" runat="server" Margins="0 0 10 0">
                    <LayoutConfig>
                        <ext:VBoxLayoutConfig Align="Center" Pack="Center" />
                    </LayoutConfig>
                    <Items>
                        <ext:GridPanel ID="GridPanel1"
                            runat="server"
                            Title="Grouped Header GridPanel"
                            Width="640"
                            Height="400"
                            ColumnLines="true">
                            <Store>
                                <ext:Store ID="Store1" runat="server">
                                    <Model>
                                        <ext:Model ID="Model1" runat="server">
                                            <Fields>
                                                <ext:ModelField Name="company" />
                                                <ext:ModelField Name="price" Type="Float" />
                                                <ext:ModelField Name="change" Type="Float" />
                                                <ext:ModelField Name="pctChange" Type="Float" />
                                                <ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
                                            </Fields>
                                        </ext:Model>
                                    </Model>
                                </ext:Store>
                            </Store>
                            <ColumnModel ID="ColumnModel1" runat="server">
                                <Columns>
                                    <ext:Column ID="Column1"
                                        runat="server"
                                        Text="Company"
                                        DataIndex="company"
                                        Flex="1"
                                        Sortable="false" />
                                    <ext:Column ID="Column3"
                                        runat="server"
                                        Text="Price"
                                        DataIndex="price"
                                        Width="75"
                                        Sortable="true" Hidden="true">
                                        <Renderer Format="UsMoney" />
                                    </ext:Column>
    
    
                                    <ext:Column ID="Column4"
                                        runat="server"
                                        Text="Change"
                                        DataIndex="change"
                                        Width="75"
                                        Sortable="true">
                                    </ext:Column>
                                    <ext:Column ID="Column5"
                                        runat="server"
                                        Text="Change %"
                                        DataIndex="pctChange"
                                        Width="75"
                                        Sortable="true">
                                    </ext:Column>
    
    
    
    
    
    
                                </Columns>
    
    
                            </ColumnModel>
                            <Features>
                                <ext:Grouping
                                    ID="Grouping1"
                                    runat="server"
                                    HideGroupedHeader="true"
                                    StartCollapsed="false"
                                    GroupHeaderTplString='{columnName}: {name} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})' />
                            </Features>
                            <View>
                                <ext:GridView ID="gvSampleGrid" runat="server"></ext:GridView>
                            </View>
                        </ext:GridPanel>
                        <ext:Button ID="img1" runat="server" Text="click to GroupIt">
                            <DirectEvents>
                                <Click OnEvent="BTN_CLICK"></Click>
                            </DirectEvents>
                        </ext:Button>
                    </Items>
                </ext:Viewport>
    
    
    
    
            </div>
        </form>
    </body>
    </html>
    Please contact If you need more clarification.

    Thank you
    Mohan
    Last edited by Daniil; Oct 18, 2013 at 11:47 AM. Reason: [CLOSED]
  2. #2
    Hello!

    It's not necessary to load data again if the store already loaded data. Also, during DirectEvent you should use Methods instead of Properties:

    protected void BTN_CLICK(object sender, DirectEventArgs e)
    {
        Column3.Show();
        Store1.Group("price");
    }
  3. #3
    Thank you very much for the help :) Close this.....

    Regards
    Mohan

Similar Threads

  1. [CLOSED] Dynamic grid with Grouping Summary and Editors
    By rthiney in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jul 06, 2011, 4:59 PM
  2. [CLOSED] Dynamic GridPanel with Grouping Summary and Sorting
    By bethc in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Jun 22, 2010, 4:22 PM
  3. [CLOSED] Dynamic Grid, Sorting and Grouping Issue
    By SymSure in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Mar 16, 2010, 1:06 PM
  4. [CLOSED] Remote grouping or grouping summary for GridPanel
    By jchau in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Nov 08, 2009, 10:23 PM
  5. dynamic grouping
    By ahmetmeral in forum 1.x Help
    Replies: 1
    Last Post: Dec 21, 2008, 4:34 AM

Tags for this Thread

Posting Permissions