Dynamic grid does not render in a dynamic panel

  1. #1

    Dynamic grid does not render in a dynamic panel

    Hello, I'm trying to render a gridpanel in a Dynamic Panel after the fire event "expand ".
    The properties "Collapsible" and "Collapsed" are true.
    For some reason the grid is not being rendered.
    Could anyone help me? Thanks!


    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication8.WebForm2" %>
    <%@ Import Namespace="System.Data"%>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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 runat="server">
            
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server">
        </ext:ResourceManager>
        </form>
    </body>
    </html>
    CodeBehind
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Ext.Net;
    using System.Data;
    
    namespace WebApplication8
    {
        public partial class WebForm2 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                Ext.Net.Panel panel;
                panel = GetPanel();
                panel.Title = "(TEST)";
                this.Page.Form.Controls.Add(panel);
            }
    
            public Ext.Net.Panel GetPanel()
            {
                Ext.Net.Panel panel = new Ext.Net.Panel();
                panel.ID = "panel1";
                panel.Collapsible = true;
                panel.Collapsed = true;
                panel.Height = 350;
                panel.AutoWidth = true;
                panel.Listeners.Collapse.Handler = "this.clearContent();";
                panel.DirectEvents.Expand.Event += new ComponentDirectEvent.DirectEventHandler(Expand_Event);
                panel.DirectEvents.Expand.EventMask.ShowMask = true;
                panel.DirectEvents.Expand.EventMask.Target = MaskTarget.CustomTarget;
                panel.DirectEvents.Expand.EventMask.CustomTarget = panel.ID;
    
                return panel;
            }
    
            protected void Expand_Event(object sender, DirectEventArgs e)
            {
                Ext.Net.Panel panel;
                GridPanel grid;
    
                panel = sender as Ext.Net.Panel;
                grid = GetGrid();
                grid.AddTo(panel);
            }
    
            private GridPanel GetGrid()
            {
                int mode = int.Parse(this.Request["grid"] ?? "1");
                DataTable dt = GetTestDataTable(mode);
    
                Store store = new Store { ID = "StoreMovimenti" };
                this.Page.Form.Controls.Add(store);
                store.Reader.Add(new JsonReader());
    
                GridPanel grid = new GridPanel
                {
                    ID = "GridPanelMovimenti",
                    AutoScroll = true,
                    AutoHeight = true,
                    StoreID = store.ID,
                    StripeRows = true,
                    Header = false,
                    AutoWidth = true
                };
                grid.TopBar.Add(GetToolbar());
                grid.LoadMask.ShowMask = true;
                grid.LoadMask.Msg = "Loading...";
                this.Page.Form.Controls.Add(grid);
    
                Ext.Net.PagingToolbar pager = new Ext.Net.PagingToolbar { PageSize = 10 };
                grid.BottomBar.Add(pager);
    
                int _n = 0;
                foreach (DataColumn column in dt.Columns)
                {
                    // ADD Column to the Reader
                    if (_n == 0)
                    {
                        ((Ext.Net.JsonReader)store.Reader[0]).IDProperty = column.ColumnName;
                    }
    
                    store.Reader[0].Fields.Add(new Ext.Net.RecordField(column.Caption));
    
                    //// ADD Column to columns collection
                    Ext.Net.Column _col = new Ext.Net.Column
                    {
                        ColumnID = ("CLM_" + _n.ToString()),
                        Header = column.Caption,
                        DataIndex = column.Caption
                    };
                    grid.ColumnModel.Columns.Add(_col);
    
                    _n++;
                }
    
                store.DataSource = dt;
                store.DataBind();
    
                return grid;
            }
    
            private static DataTable GetTestDataTable(int mode)
            {
                DataTable dt = new DataTable();
                //for example, for first grid will be two columns, for second - four columns
                int count = mode == 1 ? 2 : 4;
    
                DataColumn dc = new DataColumn("ID") { Caption = "ID" };
                dt.Columns.Add(dc);
    
                for (int i = 0; i < count; i++)
                {
                    string name = string.Format("Column{0}_{1}", mode, i);
                    dc = new DataColumn(name) { Caption = name };
                    dt.Columns.Add(dc);
                }
    
                //add 10 rows
                int timeStamp = DateTime.Now.Second;
                string cellValue = "Value" + timeStamp;
                for (int i = 0; i < 10; i++)
                {
                    object[] values = mode == 1 ? new object[] { i, cellValue, cellValue } :
                                                  new object[] { i, cellValue, cellValue, cellValue, cellValue };
                    dt.Rows.Add(values);
                }
    
                return dt;
            }
    
            public Toolbar GetToolbar()
            {
                Toolbar toolBar;
                Ext.Net.Button btnAdd;
    
                #region Botão adiconkar
                btnAdd = new Ext.Net.Button();
                btnAdd.Icon = Icon.Add;
                btnAdd.StandOut = true;
                btnAdd.DirectClick += Click_Event;
                #endregion
    
                toolBar = new Toolbar();
                toolBar.Items.Add(btnAdd);
    
                return toolBar;
            }
    
            protected void Click_Event(object sender, DirectEventArgs e)
            {
                //Some code;
            }
        }
    }
  2. #2

    Dynamic grid does not render in a dynamic panel

    Could anyone tell me what am I doing wrong? Please I would really appreciate it! Thanks!
  3. #3
    Hi,

    I see that you don't render the store
    Vladimir Shcheglov
    Sr. Developer
  4. #4

    Dynamic grid does not render in a dynamic panel

    Could you show me an example? Because the store is being added to the page at line 55. Thanks!
  5. #5
    Hi Vladimir, is now working. I changed "grid.StoreID = store.ID" by "grid.Store.Add()". Thanks!

Similar Threads

  1. Dynamic Panel on Grid Row Click
    By macinator in forum 1.x Help
    Replies: 0
    Last Post: Jul 20, 2012, 5:12 PM
  2. Replies: 12
    Last Post: Sep 20, 2011, 2:33 PM
  3. [CLOSED] Grid in tab panel dynamic.
    By stoque in forum 1.x Premium Help
    Replies: 10
    Last Post: Jul 28, 2011, 6:36 PM
  4. Dynamic Grid Panel
    By sumesh in forum 1.x Help
    Replies: 14
    Last Post: May 31, 2011, 1:53 PM
  5. Replies: 0
    Last Post: Mar 04, 2011, 6:46 AM

Tags for this Thread

Posting Permissions