[CLOSED] How to do select all and de-select all in grid with local paging?

  1. #1

    [CLOSED] How to do select all and de-select all in grid with local paging?

    Hi,

    I am wondering if how can I do select all and de-select all for rows in all grid rows in a grid panel with paging toolbar. My problem now is that the the selection is not happening on other pages other than the current page. Please help.

    Thanks.
    Last edited by Daniil; Mar 05, 2013 at 4:14 AM. Reason: [CLOSED]
  2. #2
    Hello!

    Try the following:
    // Select all
    App.GridPanel1.getSelectionModel().select(App.GridPanel1.getStore().getAllRange(), true);
    // Deselect all
    App.GridPanel1.getSelectionModel().deselect(App.GridPanel1.getStore().getAllRange(), false)
  3. #3
    Hi Baidaly,

    The code does not work and I get a runtime exception when I move to the next page which says

    Line: 18
    Error: Unable to get property 'up' of undefined or null reference

    Second question: how to get the selected rows for all pages (not just the current page)?


    Quote Originally Posted by Baidaly View Post
    Hello!

    Try the following:
    // Select all
    App.GridPanel1.getSelectionModel().select(App.GridPanel1.getStore().getAllRange(), true);
    // Deselect all
    App.GridPanel1.getSelectionModel().deselect(App.GridPanel1.getStore().getAllRange(), false)
  4. #4
    For me all works fine
    Please note that you have to define IDProperty in store to correct maintain selection between pages

    Here is my sample
    <%@ Page Language="C#" %>
    
    
    <%@ Import Namespace="System.Xml" %>
    <%@ Import Namespace="System.Collections.Generic" %>
    
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    
    <!DOCTYPE html>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
         {
             this.Store1.DataSource = new List<Company> 
             { 
                 new Company("3m Co", 71.72, 0.02, 0.03),
                 new Company("Alcoa Inc", 29.01, 0.42, 1.47),
                 new Company("Altria Group Inc", 83.81, 0.28, 0.34),
                 new Company("American Express Company", 52.55, 0.01, 0.02),
                 new Company("American International Group, Inc.", 64.13, 0.31, 0.49),
                 new Company("AT&T Inc.", 31.61, -0.48, -1.54),
                 new Company("Boeing Co.", 75.43, 0.53, 0.71),
                 new Company("Caterpillar Inc.", 67.27, 0.92, 1.39),
                 new Company("Citigroup, Inc.", 49.37, 0.02, 0.04),
                 new Company("E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28),
                 new Company("Exxon Mobil Corp", 68.1, -0.43, -0.64),
                 new Company("General Electric Company", 34.14, -0.08, -0.23),
                 new Company("General Motors Corporation", 30.27, 1.09, 3.74),
                 new Company("Hewlett-Packard Co.", 36.53, -0.03, -0.08),
                 new Company("Honeywell Intl Inc", 38.77, 0.05, 0.13),
                 new Company("Intel Corporation", 19.88, 0.31, 1.58),
                 new Company("International Business Machines", 81.41, 0.44, 0.54),
                 new Company("Johnson & Johnson", 64.72, 0.06, 0.09),
                 new Company("JP Morgan & Chase & Co", 45.73, 0.07, 0.15),
                 new Company("McDonald\"s Corporation", 36.76, 0.86, 2.40),
                 new Company("Merck & Co., Inc.", 40.96, 0.41, 1.01),
                 new Company("Microsoft Corporation", 25.84, 0.14, 0.54),
                 new Company("Pfizer Inc", 27.96, 0.4, 1.45),
                 new Company("The Coca-Cola Company", 45.07, 0.26, 0.58),
                 new Company("The Home Depot, Inc.", 34.64, 0.35, 1.02),
                 new Company("The Procter & Gamble Company", 61.91, 0.01, 0.02),
                 new Company("United Technologies Corporation", 63.26, 0.55, 0.88),
                 new Company("Verizon Communications", 35.57, 0.39, 1.11),
                 new Company("Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63)
             };
    
    
            if (!X.IsAjaxRequest)
            {
                this.Store1.DataBind();
            }
        }
    
    
        protected void Button1_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
    
    
            StringBuilder sb = new StringBuilder();
    
    
            foreach (SelectedRow row in sm.SelectedRows)
            {
                sb.AppendFormat("RecordID: {0}&nbsp;&nbsp;&nbsp;&nbsp;<br/>", row.RecordID);
            }
            this.Label1.Html = sb.ToString();
        }
    
    
        protected void Add_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
            sm.SelectedRows.Add(new SelectedRow("Boeing Co."));
            sm.UpdateSelection();
        }
    
    
        protected void SubmitSelection(object sender, DirectEventArgs e)
        {
            string json = e.ExtraParams["Values"];
    
    
            Dictionary<string, string>[] companies = JSON.Deserialize<Dictionary<string, string>[]>(json);
    
    
            StringBuilder sb = new StringBuilder();
            sb.Append("<table  cellspacing='15'>");
            bool addHeader = true;
            
            foreach (Dictionary<string, string> row in companies)
            {
                if (addHeader)
                {
                    sb.Append("<tr>");
                    foreach (KeyValuePair<string, string> keyValuePair in row)
                    {
                        sb.Append("<td style='white-space:nowrap;font-weight:bold;padding:5px;'>");
    
    
                        sb.Append(keyValuePair.Key);
    
    
                        sb.Append("</td>");
                    }
                    sb.Append("</tr>");
    
    
                    addHeader = false;
                }
                
                sb.Append("<tr>");
                foreach (KeyValuePair<string, string> keyValuePair in row)
                {
                    sb.Append("<td style='white-space:nowrap;padding:5px;'>");
    
    
                    sb.Append(keyValuePair.Value);
    
    
                    sb.Append("</td>");
                }
                sb.Append("</tr>");
            }
            sb.Append("</table>");
            this.Label1.Html = sb.ToString();
        }
    
    
        public class Company
        {
            public Company(string name, double price, double change, double pctChange)
            {
                this.Name = name;
                this.Price = price;
                this.Change = change;
                this.PctChange = pctChange;
            }
    
    
            public Company()
            {
            }
    
    
            public string Name { get;set; }
            public double Price { get;set; }
            public double Change { get;set; }
            public double PctChange { get;set; }
        }
    </script>
    
    
    <html>
    <head runat="server">
        <title>Row Selection Model</title>
    </head>
    <body>
         <form runat="server">
            <ext:ResourceManager runat="server" />
        
            <ext:Store ID="Store1" runat="server" PageSize="10">
                <Model>
                    <ext:Model runat="server" IDProperty="Name">
                        <Fields>
                            <ext:ModelField Name="Name" />
                            <ext:ModelField Name="Price" />
                            <ext:ModelField Name="Change" />
                            <ext:ModelField Name="PctChange" />
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
        
            <ext:GridPanel 
                ID="GridPanel1" 
                runat="server" 
                StoreID="Store1"
                Title="Company List"
                Collapsible="true"
                Width="600"
                Height="350">
                <ColumnModel runat="server">
    	            <Columns>
                        <ext:Column runat="server" Text="Company" DataIndex="Name" Flex="1" />
                        <ext:Column runat="server" Text="Price" Width="75" DataIndex="Price">
                            <Renderer Format="UsMoney" />
                        </ext:Column>
                        <ext:Column runat="server" Text="Change" Width="75" DataIndex="Change" />
                        <ext:Column runat="server" Text="Change" Width="75" DataIndex="PctChange" />
    	            </Columns>
                </ColumnModel>
                <SelectionModel>
                    <ext:RowSelectionModel runat="server" Mode="Multi" />
                </SelectionModel>           
                <BottomBar>
                    <ext:PagingToolbar runat="server" />
                </BottomBar>
                <Buttons>
                    <ext:Button runat="server" Text="Select All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().select(App.GridPanel1.getStore().getAllRange(), true);" />
                        </Listeners>
                    </ext:Button>
    
    
                    <ext:Button runat="server" Text="Deselect All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().deselect(App.GridPanel1.getStore().getAllRange(), false);" />
                        </Listeners>
                    </ext:Button>
    
    
                    <ext:Button runat="server" Text="Submit">
                        <DirectEvents>
                            <Click OnEvent="Button1_Click" />
                        </DirectEvents>
                    </ext:Button>
                
                    <ext:Button runat="server" Text="Submit with values">
                        <DirectEvents>
                            <Click OnEvent="SubmitSelection">
                                <ExtraParams>
                                    <ext:Parameter Name="Values" Value="Ext.encode(#{GridPanel1}.getRowsValues({selectedOnly:true}))" Mode="Raw" />
                                </ExtraParams>
                            </Click>
                        </DirectEvents>
                    </ext:Button>
                </Buttons>
            </ext:GridPanel>
         
            <div style="width:590px; border:1px solid gray; padding:5px;">
                <ext:Label ID="Label1" runat="server" />
            </div>    
        
        </form>
    </body>
    </html>
  5. #5
    Hi Vladimir,

    Yes, I have an IDProperty defined in my store, except that I used a razor view with MVC. Also, the ext.net version is 2.1.0.19555. Could it make a difference?

    Also, do you have a MVC and razor view example showing how paging with select all is done? It just doesn't work in my case.

    Thanks.

    Quote Originally Posted by Vladimir View Post
    For me all works fine
    Please note that you have to define IDProperty in store to correct maintain selection between pages

    Here is my sample
    <%@ Page Language="C#" %>
    
    
    <%@ Import Namespace="System.Xml" %>
    <%@ Import Namespace="System.Collections.Generic" %>
    
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    
    <!DOCTYPE html>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
         {
             this.Store1.DataSource = new List<Company> 
             { 
                 new Company("3m Co", 71.72, 0.02, 0.03),
                 new Company("Alcoa Inc", 29.01, 0.42, 1.47),
                 new Company("Altria Group Inc", 83.81, 0.28, 0.34),
                 new Company("American Express Company", 52.55, 0.01, 0.02),
                 new Company("American International Group, Inc.", 64.13, 0.31, 0.49),
                 new Company("AT&T Inc.", 31.61, -0.48, -1.54),
                 new Company("Boeing Co.", 75.43, 0.53, 0.71),
                 new Company("Caterpillar Inc.", 67.27, 0.92, 1.39),
                 new Company("Citigroup, Inc.", 49.37, 0.02, 0.04),
                 new Company("E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28),
                 new Company("Exxon Mobil Corp", 68.1, -0.43, -0.64),
                 new Company("General Electric Company", 34.14, -0.08, -0.23),
                 new Company("General Motors Corporation", 30.27, 1.09, 3.74),
                 new Company("Hewlett-Packard Co.", 36.53, -0.03, -0.08),
                 new Company("Honeywell Intl Inc", 38.77, 0.05, 0.13),
                 new Company("Intel Corporation", 19.88, 0.31, 1.58),
                 new Company("International Business Machines", 81.41, 0.44, 0.54),
                 new Company("Johnson & Johnson", 64.72, 0.06, 0.09),
                 new Company("JP Morgan & Chase & Co", 45.73, 0.07, 0.15),
                 new Company("McDonald\"s Corporation", 36.76, 0.86, 2.40),
                 new Company("Merck & Co., Inc.", 40.96, 0.41, 1.01),
                 new Company("Microsoft Corporation", 25.84, 0.14, 0.54),
                 new Company("Pfizer Inc", 27.96, 0.4, 1.45),
                 new Company("The Coca-Cola Company", 45.07, 0.26, 0.58),
                 new Company("The Home Depot, Inc.", 34.64, 0.35, 1.02),
                 new Company("The Procter & Gamble Company", 61.91, 0.01, 0.02),
                 new Company("United Technologies Corporation", 63.26, 0.55, 0.88),
                 new Company("Verizon Communications", 35.57, 0.39, 1.11),
                 new Company("Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63)
             };
    
    
            if (!X.IsAjaxRequest)
            {
                this.Store1.DataBind();
            }
        }
    
    
        protected void Button1_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
    
    
            StringBuilder sb = new StringBuilder();
    
    
            foreach (SelectedRow row in sm.SelectedRows)
            {
                sb.AppendFormat("RecordID: {0}&nbsp;&nbsp;&nbsp;&nbsp;<br/>", row.RecordID);
            }
            this.Label1.Html = sb.ToString();
        }
    
    
        protected void Add_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
            sm.SelectedRows.Add(new SelectedRow("Boeing Co."));
            sm.UpdateSelection();
        }
    
    
        protected void SubmitSelection(object sender, DirectEventArgs e)
        {
            string json = e.ExtraParams["Values"];
    
    
            Dictionary<string, string>[] companies = JSON.Deserialize<Dictionary<string, string>[]>(json);
    
    
            StringBuilder sb = new StringBuilder();
            sb.Append("<table  cellspacing='15'>");
            bool addHeader = true;
            
            foreach (Dictionary<string, string> row in companies)
            {
                if (addHeader)
                {
                    sb.Append("<tr>");
                    foreach (KeyValuePair<string, string> keyValuePair in row)
                    {
                        sb.Append("<td style='white-space:nowrap;font-weight:bold;padding:5px;'>");
    
    
                        sb.Append(keyValuePair.Key);
    
    
                        sb.Append("</td>");
                    }
                    sb.Append("</tr>");
    
    
                    addHeader = false;
                }
                
                sb.Append("<tr>");
                foreach (KeyValuePair<string, string> keyValuePair in row)
                {
                    sb.Append("<td style='white-space:nowrap;padding:5px;'>");
    
    
                    sb.Append(keyValuePair.Value);
    
    
                    sb.Append("</td>");
                }
                sb.Append("</tr>");
            }
            sb.Append("</table>");
            this.Label1.Html = sb.ToString();
        }
    
    
        public class Company
        {
            public Company(string name, double price, double change, double pctChange)
            {
                this.Name = name;
                this.Price = price;
                this.Change = change;
                this.PctChange = pctChange;
            }
    
    
            public Company()
            {
            }
    
    
            public string Name { get;set; }
            public double Price { get;set; }
            public double Change { get;set; }
            public double PctChange { get;set; }
        }
    </script>
    
    
    <html>
    <head runat="server">
        <title>Row Selection Model</title>
    </head>
    <body>
         <form runat="server">
            <ext:ResourceManager runat="server" />
        
            <ext:Store ID="Store1" runat="server" PageSize="10">
                <Model>
                    <ext:Model runat="server" IDProperty="Name">
                        <Fields>
                            <ext:ModelField Name="Name" />
                            <ext:ModelField Name="Price" />
                            <ext:ModelField Name="Change" />
                            <ext:ModelField Name="PctChange" />
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
        
            <ext:GridPanel 
                ID="GridPanel1" 
                runat="server" 
                StoreID="Store1"
                Title="Company List"
                Collapsible="true"
                Width="600"
                Height="350">
                <ColumnModel runat="server">
    	            <Columns>
                        <ext:Column runat="server" Text="Company" DataIndex="Name" Flex="1" />
                        <ext:Column runat="server" Text="Price" Width="75" DataIndex="Price">
                            <Renderer Format="UsMoney" />
                        </ext:Column>
                        <ext:Column runat="server" Text="Change" Width="75" DataIndex="Change" />
                        <ext:Column runat="server" Text="Change" Width="75" DataIndex="PctChange" />
    	            </Columns>
                </ColumnModel>
                <SelectionModel>
                    <ext:RowSelectionModel runat="server" Mode="Multi" />
                </SelectionModel>           
                <BottomBar>
                    <ext:PagingToolbar runat="server" />
                </BottomBar>
                <Buttons>
                    <ext:Button runat="server" Text="Select All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().select(App.GridPanel1.getStore().getAllRange(), true);" />
                        </Listeners>
                    </ext:Button>
    
    
                    <ext:Button runat="server" Text="Deselect All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().deselect(App.GridPanel1.getStore().getAllRange(), false);" />
                        </Listeners>
                    </ext:Button>
    
    
                    <ext:Button runat="server" Text="Submit">
                        <DirectEvents>
                            <Click OnEvent="Button1_Click" />
                        </DirectEvents>
                    </ext:Button>
                
                    <ext:Button runat="server" Text="Submit with values">
                        <DirectEvents>
                            <Click OnEvent="SubmitSelection">
                                <ExtraParams>
                                    <ext:Parameter Name="Values" Value="Ext.encode(#{GridPanel1}.getRowsValues({selectedOnly:true}))" Mode="Raw" />
                                </ExtraParams>
                            </Click>
                        </DirectEvents>
                    </ext:Button>
                </Buttons>
            </ext:GridPanel>
         
            <div style="width:590px; border:1px solid gray; padding:5px;">
                <ext:Label ID="Label1" runat="server" />
            </div>    
        
        </form>
    </body>
    </html>
  6. #6
    Yes, I have an IDProperty defined in my store, except that I used a razor view with MVC. Also, the ext.net version is 2.1.0.19555. Could it make a difference?
    No, there is no difference. Please post a sample demonstrates the issue
  7. #7
    Hi Vladimir,

    Yes I can reproduce the problem by just using your testcase. The problem is in the grouping. I added group by name in your example, and do a select all and I get the exception when I more to the next page and get this problem

    Line: 18
    Error: Unable to get property 'up' of undefined or null reference

    Can you please fix the bug as soon as possible, or better yet, propose a work around before your fix?

    Thanks a lot.

    Quote Originally Posted by Vladimir View Post
    No, there is no difference. Please post a sample demonstrates the issue


    
    <%@ Page Language="C#" %>
     
     
    <%@ Import Namespace="System.Xml" %>
    <%@ Import Namespace="System.Collections.Generic" %>
     
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
     
    <!DOCTYPE html>
     
     
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
         {
             this.Store1.DataSource = new List<Company> 
             { 
                 new Company("3m Co", 71.72, 0.02, 0.03),
                 new Company("Alcoa Inc", 29.01, 0.42, 1.47),
                 new Company("Altria Group Inc", 83.81, 0.28, 0.34),
                 new Company("American Express Company", 52.55, 0.01, 0.02),
                 new Company("American International Group, Inc.", 64.13, 0.31, 0.49),
                 new Company("AT&T Inc.", 31.61, -0.48, -1.54),
                 new Company("Boeing Co.", 75.43, 0.53, 0.71),
                 new Company("Caterpillar Inc.", 67.27, 0.92, 1.39),
                 new Company("Citigroup, Inc.", 49.37, 0.02, 0.04),
                 new Company("E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28),
                 new Company("Exxon Mobil Corp", 68.1, -0.43, -0.64),
                 new Company("General Electric Company", 34.14, -0.08, -0.23),
                 new Company("General Motors Corporation", 30.27, 1.09, 3.74),
                 new Company("Hewlett-Packard Co.", 36.53, -0.03, -0.08),
                 new Company("Honeywell Intl Inc", 38.77, 0.05, 0.13),
                 new Company("Intel Corporation", 19.88, 0.31, 1.58),
                 new Company("International Business Machines", 81.41, 0.44, 0.54),
                 new Company("Johnson & Johnson", 64.72, 0.06, 0.09),
                 new Company("JP Morgan & Chase & Co", 45.73, 0.07, 0.15),
                 new Company("McDonald\"s Corporation", 36.76, 0.86, 2.40),
                 new Company("Merck & Co., Inc.", 40.96, 0.41, 1.01),
                 new Company("Microsoft Corporation", 25.84, 0.14, 0.54),
                 new Company("Pfizer Inc", 27.96, 0.4, 1.45),
                 new Company("The Coca-Cola Company", 45.07, 0.26, 0.58),
                 new Company("The Home Depot, Inc.", 34.64, 0.35, 1.02),
                 new Company("The Procter & Gamble Company", 61.91, 0.01, 0.02),
                 new Company("United Technologies Corporation", 63.26, 0.55, 0.88),
                 new Company("Verizon Communications", 35.57, 0.39, 1.11),
                 new Company("Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63)
             };
     
     
            if (!X.IsAjaxRequest)
            {
                this.Store1.DataBind();
            }
        }
     
     
        protected void Button1_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
     
     
            StringBuilder sb = new StringBuilder();
     
     
            foreach (SelectedRow row in sm.SelectedRows)
            {
                sb.AppendFormat("RecordID: {0}&nbsp;&nbsp;&nbsp;&nbsp;<br/>", row.RecordID);
            }
            this.Label1.Html = sb.ToString();
        }
     
     
        protected void Add_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
            sm.SelectedRows.Add(new SelectedRow("Boeing Co."));
            sm.UpdateSelection();
        }
     
     
        protected void SubmitSelection(object sender, DirectEventArgs e)
        {
            string json = e.ExtraParams["Values"];
     
     
            Dictionary<string, string>[] companies = JSON.Deserialize<Dictionary<string, string>[]>(json);
     
     
            StringBuilder sb = new StringBuilder();
            sb.Append("<table  cellspacing='15'>");
            bool addHeader = true;
             
            foreach (Dictionary<string, string> row in companies)
            {
                if (addHeader)
                {
                    sb.Append("<tr>");
                    foreach (KeyValuePair<string, string> keyValuePair in row)
                    {
                        sb.Append("<td style='white-space:nowrap;font-weight:bold;padding:5px;'>");
     
     
                        sb.Append(keyValuePair.Key);
     
     
                        sb.Append("</td>");
                    }
                    sb.Append("</tr>");
     
     
                    addHeader = false;
                }
                 
                sb.Append("<tr>");
                foreach (KeyValuePair<string, string> keyValuePair in row)
                {
                    sb.Append("<td style='white-space:nowrap;padding:5px;'>");
     
     
                    sb.Append(keyValuePair.Value);
     
     
                    sb.Append("</td>");
                }
                sb.Append("</tr>");
            }
            sb.Append("</table>");
            this.Label1.Html = sb.ToString();
        }
     
     
        public class Company
        {
            public Company(string name, double price, double change, double pctChange)
            {
                this.Name = name;
                this.Price = price;
                this.Change = change;
                this.PctChange = pctChange;
            }
     
     
            public Company()
            {
            }
     
     
            public string Name { get;set; }
            public double Price { get;set; }
            public double Change { get;set; }
            public double PctChange { get;set; }
        }
    </script>
     
     
    <html>
    <head id="Head1" runat="server">
        <title>Row Selection Model</title>
    </head>
    <body>
         <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" />
         
            <ext:Store ID="Store1" runat="server" PageSize="10" GroupField="Name">
                <Model>
                    <ext:Model ID="Model1" runat="server" IDProperty="Name">
                        <Fields>
                            <ext:ModelField Name="Name" />
                            <ext:ModelField Name="Price" />
                            <ext:ModelField Name="Change" />
                            <ext:ModelField Name="PctChange" />
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
         
            <ext:GridPanel
                ID="GridPanel1"
                runat="server"
                StoreID="Store1"
                Title="Company List"
                Collapsible="true"
                Width="600"
                Height="350">
                <ColumnModel ID="ColumnModel1" runat="server">
                    <Columns>
                        <ext:Column ID="Column1" runat="server" Text="Company" DataIndex="Name" Flex="1" />
                        <ext:Column ID="Column2" runat="server" Text="Price" Width="75" DataIndex="Price">
                            <Renderer Format="UsMoney" />
                        </ext:Column>
                        <ext:Column ID="Column3" runat="server" Text="Change" Width="75" DataIndex="Change" />
                        <ext:Column ID="Column4" runat="server" Text="Change" Width="75" DataIndex="PctChange" />
                    </Columns>
                </ColumnModel>
                <SelectionModel>
                    <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Multi" />
                </SelectionModel>           
                <BottomBar>
                    <ext:PagingToolbar ID="PagingToolbar1" runat="server" />
                </BottomBar>
                <Buttons>
                    <ext:Button ID="Button1" runat="server" Text="Select All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().select(App.GridPanel1.getStore().getAllRange(), true);" />
                        </Listeners>
                    </ext:Button>
     
     
                    <ext:Button ID="Button2" runat="server" Text="Deselect All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().deselect(App.GridPanel1.getStore().getAllRange(), false);" />
                        </Listeners>
                    </ext:Button>
     
     
                    <ext:Button ID="Button3" runat="server" Text="Submit">
                        <DirectEvents>
                            <Click OnEvent="Button1_Click" />
                        </DirectEvents>
                    </ext:Button>
                 
                    <ext:Button ID="Button4" runat="server" Text="Submit with values">
                        <DirectEvents>
                            <Click OnEvent="SubmitSelection">
                                <ExtraParams>
                                    <ext:Parameter Name="Values" Value="Ext.encode(#{GridPanel1}.getRowsValues({selectedOnly:true}))" Mode="Raw" />
                                </ExtraParams>
                            </Click>
                        </DirectEvents>
                    </ext:Button>
                </Buttons>
                 <Features>
                    <ext:Grouping
                        ID="Grouping1"
                        runat="server"
                        HideGroupedHeader="true"
                        StartCollapsed="true"
                        GroupHeaderTplString='{columnName}: {name} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})' />
                    <ext:RowBody ID="RowBody1" runat="server">
                        <GetAdditionalData 
                            Handler="var d = data;
                                     orig.rowBodyColspan = record.fields.getCount();
                                     orig.rowBody = Ext.String.format('<div style=\'padding:0 5px 5px 5px;\'>The {0} [{1}] requires light conditions of <i>{2}</i>.<br /><b>Price: {3}</b></div>', d.Common, d.Botanical, d.Light, Ext.util.Format.usMoney(d.Price));"
                            />
                    </ext:RowBody>
                </Features>
            </ext:GridPanel>
          
            <div style="width:590px; border:1px solid gray; padding:5px;">
                <ext:Label ID="Label1" runat="server" />
            </div>    
         
        </form>
    </body>
    </html>
  8. #8
    Please look at my modified changes in your example below to see the error yourself. Many Thanks.!!!!!!!

    Quote Originally Posted by gets_gui View Post
    Hi Vladimir,

    Yes I can reproduce the problem by just using your testcase. The problem is in the grouping. I added group by name in your example, and do a select all and I get the exception when I more to the next page and get this problem

    Line: 18
    Error: Unable to get property 'up' of undefined or null reference

    Can you please fix the bug as soon as possible, or better yet, propose a work around before your fix?

    Thanks a lot.





    
    <%@ Page Language="C#" %>
     
     
    <%@ Import Namespace="System.Xml" %>
    <%@ Import Namespace="System.Collections.Generic" %>
     
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
     
    <!DOCTYPE html>
     
     
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
         {
             this.Store1.DataSource = new List<Company> 
             { 
                 new Company("3m Co", 71.72, 0.02, 0.03),
                 new Company("Alcoa Inc", 29.01, 0.42, 1.47),
                 new Company("Altria Group Inc", 83.81, 0.28, 0.34),
                 new Company("American Express Company", 52.55, 0.01, 0.02),
                 new Company("American International Group, Inc.", 64.13, 0.31, 0.49),
                 new Company("AT&T Inc.", 31.61, -0.48, -1.54),
                 new Company("Boeing Co.", 75.43, 0.53, 0.71),
                 new Company("Caterpillar Inc.", 67.27, 0.92, 1.39),
                 new Company("Citigroup, Inc.", 49.37, 0.02, 0.04),
                 new Company("E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28),
                 new Company("Exxon Mobil Corp", 68.1, -0.43, -0.64),
                 new Company("General Electric Company", 34.14, -0.08, -0.23),
                 new Company("General Motors Corporation", 30.27, 1.09, 3.74),
                 new Company("Hewlett-Packard Co.", 36.53, -0.03, -0.08),
                 new Company("Honeywell Intl Inc", 38.77, 0.05, 0.13),
                 new Company("Intel Corporation", 19.88, 0.31, 1.58),
                 new Company("International Business Machines", 81.41, 0.44, 0.54),
                 new Company("Johnson & Johnson", 64.72, 0.06, 0.09),
                 new Company("JP Morgan & Chase & Co", 45.73, 0.07, 0.15),
                 new Company("McDonald\"s Corporation", 36.76, 0.86, 2.40),
                 new Company("Merck & Co., Inc.", 40.96, 0.41, 1.01),
                 new Company("Microsoft Corporation", 25.84, 0.14, 0.54),
                 new Company("Pfizer Inc", 27.96, 0.4, 1.45),
                 new Company("The Coca-Cola Company", 45.07, 0.26, 0.58),
                 new Company("The Home Depot, Inc.", 34.64, 0.35, 1.02),
                 new Company("The Procter & Gamble Company", 61.91, 0.01, 0.02),
                 new Company("United Technologies Corporation", 63.26, 0.55, 0.88),
                 new Company("Verizon Communications", 35.57, 0.39, 1.11),
                 new Company("Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63)
             };
     
     
            if (!X.IsAjaxRequest)
            {
                this.Store1.DataBind();
            }
        }
     
     
        protected void Button1_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
     
     
            StringBuilder sb = new StringBuilder();
     
     
            foreach (SelectedRow row in sm.SelectedRows)
            {
                sb.AppendFormat("RecordID: {0}&nbsp;&nbsp;&nbsp;&nbsp;<br/>", row.RecordID);
            }
            this.Label1.Html = sb.ToString();
        }
     
     
        protected void Add_Click(object sender, DirectEventArgs e)
        {
            RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
            sm.SelectedRows.Add(new SelectedRow("Boeing Co."));
            sm.UpdateSelection();
        }
     
     
        protected void SubmitSelection(object sender, DirectEventArgs e)
        {
            string json = e.ExtraParams["Values"];
     
     
            Dictionary<string, string>[] companies = JSON.Deserialize<Dictionary<string, string>[]>(json);
     
     
            StringBuilder sb = new StringBuilder();
            sb.Append("<table  cellspacing='15'>");
            bool addHeader = true;
             
            foreach (Dictionary<string, string> row in companies)
            {
                if (addHeader)
                {
                    sb.Append("<tr>");
                    foreach (KeyValuePair<string, string> keyValuePair in row)
                    {
                        sb.Append("<td style='white-space:nowrap;font-weight:bold;padding:5px;'>");
     
     
                        sb.Append(keyValuePair.Key);
     
     
                        sb.Append("</td>");
                    }
                    sb.Append("</tr>");
     
     
                    addHeader = false;
                }
                 
                sb.Append("<tr>");
                foreach (KeyValuePair<string, string> keyValuePair in row)
                {
                    sb.Append("<td style='white-space:nowrap;padding:5px;'>");
     
     
                    sb.Append(keyValuePair.Value);
     
     
                    sb.Append("</td>");
                }
                sb.Append("</tr>");
            }
            sb.Append("</table>");
            this.Label1.Html = sb.ToString();
        }
     
     
        public class Company
        {
            public Company(string name, double price, double change, double pctChange)
            {
                this.Name = name;
                this.Price = price;
                this.Change = change;
                this.PctChange = pctChange;
            }
     
     
            public Company()
            {
            }
     
     
            public string Name { get;set; }
            public double Price { get;set; }
            public double Change { get;set; }
            public double PctChange { get;set; }
        }
    </script>
     
     
    <html>
    <head id="Head1" runat="server">
        <title>Row Selection Model</title>
    </head>
    <body>
         <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" />
         
            <ext:Store ID="Store1" runat="server" PageSize="10" GroupField="Name">
                <Model>
                    <ext:Model ID="Model1" runat="server" IDProperty="Name">
                        <Fields>
                            <ext:ModelField Name="Name" />
                            <ext:ModelField Name="Price" />
                            <ext:ModelField Name="Change" />
                            <ext:ModelField Name="PctChange" />
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
         
            <ext:GridPanel
                ID="GridPanel1"
                runat="server"
                StoreID="Store1"
                Title="Company List"
                Collapsible="true"
                Width="600"
                Height="350">
                <ColumnModel ID="ColumnModel1" runat="server">
                    <Columns>
                        <ext:Column ID="Column1" runat="server" Text="Company" DataIndex="Name" Flex="1" />
                        <ext:Column ID="Column2" runat="server" Text="Price" Width="75" DataIndex="Price">
                            <Renderer Format="UsMoney" />
                        </ext:Column>
                        <ext:Column ID="Column3" runat="server" Text="Change" Width="75" DataIndex="Change" />
                        <ext:Column ID="Column4" runat="server" Text="Change" Width="75" DataIndex="PctChange" />
                    </Columns>
                </ColumnModel>
                <SelectionModel>
                    <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Multi" />
                </SelectionModel>           
                <BottomBar>
                    <ext:PagingToolbar ID="PagingToolbar1" runat="server" />
                </BottomBar>
                <Buttons>
                    <ext:Button ID="Button1" runat="server" Text="Select All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().select(App.GridPanel1.getStore().getAllRange(), true);" />
                        </Listeners>
                    </ext:Button>
     
     
                    <ext:Button ID="Button2" runat="server" Text="Deselect All">
                        <Listeners>
                            <Click Handler="App.GridPanel1.getSelectionModel().deselect(App.GridPanel1.getStore().getAllRange(), false);" />
                        </Listeners>
                    </ext:Button>
     
     
                    <ext:Button ID="Button3" runat="server" Text="Submit">
                        <DirectEvents>
                            <Click OnEvent="Button1_Click" />
                        </DirectEvents>
                    </ext:Button>
                 
                    <ext:Button ID="Button4" runat="server" Text="Submit with values">
                        <DirectEvents>
                            <Click OnEvent="SubmitSelection">
                                <ExtraParams>
                                    <ext:Parameter Name="Values" Value="Ext.encode(#{GridPanel1}.getRowsValues({selectedOnly:true}))" Mode="Raw" />
                                </ExtraParams>
                            </Click>
                        </DirectEvents>
                    </ext:Button>
                </Buttons>
                 <Features>
                    <ext:Grouping
                        ID="Grouping1"
                        runat="server"
                        HideGroupedHeader="true"
                        StartCollapsed="true"
                        GroupHeaderTplString='{columnName}: {name} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})' />
                    <ext:RowBody ID="RowBody1" runat="server">
                        <GetAdditionalData 
                            Handler="var d = data;
                                     orig.rowBodyColspan = record.fields.getCount();
                                     orig.rowBody = Ext.String.format('<div style=\'padding:0 5px 5px 5px;\'>The {0} [{1}] requires light conditions of <i>{2}</i>.<br /><b>Price: {3}</b></div>', d.Common, d.Botanical, d.Light, Ext.util.Format.usMoney(d.Price));"
                            />
                    </ext:RowBody>
                </Features>
            </ext:GridPanel>
          
            <div style="width:590px; border:1px solid gray; padding:5px;">
                <ext:Label ID="Label1" runat="server" />
            </div>    
         
        </form>
    </body>
    </html>
  9. #9
    I have no any errors with your modified sample, please update from trunk and retest
    By the way, using paging and grouping is not good idea because rows from other pages are not in included to group on the current page (for example, if records count in group> page size)

Similar Threads

  1. [CLOSED] GridPanel check row on select ( Multiple select)
    By FpNetWorth in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 12, 2013, 12:23 PM
  2. Replies: 11
    Last Post: Jun 13, 2012, 4:53 PM
  3. Replies: 0
    Last Post: Sep 19, 2011, 11:11 AM
  4. [CLOSED] Is it possible to Select Items of a multi select during ajax event
    By vedagopal2004 in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jul 29, 2010, 6:28 PM
  5. Multi Select select/deselect
    By Palash in forum 1.x Help
    Replies: 2
    Last Post: Sep 18, 2009, 3:49 AM

Tags for this Thread

Posting Permissions