Programly select rows of a GridPanel in an inactive tab not working

  1. #1

    Programly select rows of a GridPanel in an inactive tab not working

    Hi, I'm new to Ext.net, and have a problem getting a page work correctly.
    Basicly, I have a window contains two tabs, the second tab is a GridPanel and is initially inactive.

    I want to programly select two rows of this GridPanel(via CheckboxSelectionModel) when I click the "show window" button , but found my method not working. There will be a javascript error thrown and no rows would selected. After I manually clicked the second tab, everything works well.

    Here's my code: (demo)
    <%@ 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)
            {
                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" }
                };
            }
        }
    
        protected void Button1_Click(object sender, DirectEventArgs e)
        {
            wndTest.Show();
            var sm = GridPanel1.SelectionModel.Primary as CheckboxSelectionModel;
            sm.SelectRows(new int[] { 0, 2 }, false);
        }
    </script>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ResourceManager runat="server">
        </ext:ResourceManager>
        <ext:Button Text="show window" OnDirectClick="Button1_Click" runat="server" />
        <ext:Window Title="test" ID="wndTest" AutoShow="false" runat="server" Layout="Fit" Width="250" Height="300">
            <Items>
                <ext:TabPanel runat="server">
                    <Items>
                        <ext:Panel Title="Information" runat="server" Html="Welcome here!">
                        </ext:Panel>
                        <ext:GridPanel ID="GridPanel1" runat="server" Border="false" Layout="fit" Title="Report">
                            <Store>
                                <ext:Store ID="Store1" runat="server" AutoLoad="true">
                                    <Reader>
                                        <ext:ArrayReader IDProperty="Id">
                                            <Fields>
                                                <ext:RecordField Name="Id" Type="String" />
                                                <ext:RecordField Name="Name" Type="String" />
                                            </Fields>
                                        </ext:ArrayReader>
                                    </Reader>
                                </ext:Store>
                            </Store>
                            <ColumnModel runat="server">
                                <Columns>
                                    <ext:Column Header="Id" DataIndex="Id" />
                                    <ext:Column Header="Name" DataIndex="Name" />
                                </Columns>
                            </ColumnModel>
                            <SelectionModel>
                                <ext:CheckboxSelectionModel runat="server" />
                            </SelectionModel>
                        </ext:GridPanel>
                    </Items>
                </ext:TabPanel>
            </Items>
        </ext:Window>
        </form>
    </body>
    </html>
    I got this error when I click the button:
    Uncaught TypeError: Cannot read property 'store' of undefined
    Ext.grid.RowSelectionModel.Ext.extend.clearSelectionsext.axd:11
    Ext.grid.RowSelectionModel.Ext.extend.selectRows
    ...
    basicly, I guess it's because the checkboxSelectionModel component is not fully initialized until I manually clicked the second tab and the GridView get rendered.

    Can anyone help?
  2. #2
    Resolved, just add config DeferredRender="false" to the TabPanel, everything works ok.

Similar Threads

  1. [CLOSED] Help with checkbox in gridpanel header to select all rows
    By Pablo_Azevedo in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 24, 2010, 7:41 PM
  2. [CLOSED] select grid rows with ajax handler
    By hillscottc in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: May 07, 2010, 4:46 PM
  3. [CLOSED] Select rows All in GridPanel
    By Hari_CSC in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Apr 09, 2010, 1:58 PM
  4. Replies: 5
    Last Post: Mar 24, 2010, 5:15 PM
  5. Select rows in a Grid with a list of record Id
    By fquintero in forum 1.x Help
    Replies: 1
    Last Post: Dec 01, 2009, 4:14 PM

Posting Permissions