What's New?

[FIXED] [1.1.0] Bug with dynamic Add/Remove of panels

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Aug 09, 2011, 4:47 PM

    [FIXED] [1.1.0] Bug with dynamic Add/Remove of panels

    Hello,

    I think that i found a some bug ( may be just a problem ) with dynamic adding and removing of panels.
    I created simple application which reproduce bug.
    Idea of application is that we have 3 buttons and 2 panels. Clicking of buttons should switch current view.
    Everything work fine, untill in class PanelType2 i didnt add second panel. With only one panel ( in example i use TabPanel ),
    thinks work fine. But when i add second panel ( in example i use simple Panel ) , switching of view from Panel2 to Panel1
    raise exception with view state. If i click reload page ( F5 ) on browser, thinks are correct again.
    I read lot of posts in forum, but seems like what i did is correct, and problem is in Ext.Net.

    Used version of Ext.Net : ext.net.community.1.1.full.source
    Ext.Net is compiled with : Visual Studio 2010 Professional
    Application is compiled with : Visual Studio 2010 Professional

    Below is a code of default page and code of demo application. And i will be very happy if some can explain where is a problem
    and how to fix it.

    --------------------------------------------------------------------
    File : Default.aspx

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication2._Default" %>
<%@ 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 runat="server">
</head>
<body>
<form id="form1"  runat="server">
<ext:ResourceManager runat="server" />
    <ext:Viewport runat="server" ID="id_viewport">
            <Items>
                <ext:Panel runat="server">
                    <TopBar>
                        <ext:Toolbar runat="server">
                            <Items>
                                <ext:Button runat="server" ID="Button1" Text="Video - MP4"></ext:Button>
                                <ext:Button runat="server" ID="Button2" Text="Images"></ext:Button>
                                <ext:Button runat="server" ID="Button3" Text="Video - WMV"></ext:Button>
                            </Items>
                        </ext:Toolbar>
                    </TopBar>
                    <Items>
                        <ext:Panel runat="server" id="id_container" Title="Main panel" >
                        </ext:Panel>
                    </Items>
                </ext:Panel>
            </Items>
        </ext:Viewport>
</form>
</body>
</html>
    --------------------------------------------------------------------------------------------------------
    File : Default.aspx.cs

    using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net;

namespace WebApplication2
{
    public class PanelType1 : Ext.Net.Panel
    {
        public PanelType1( int type)
        {
            this.ID = "id_paneltype_1";
            this.Title = "Video ";

            if (type == 1)
                this.Title += "MP3" + "... Updated on " + DateTime.Now;
            else
                this.Title += "WMV" + "... Updated on " + DateTime.Now;

            this.Height = 300;

            BodyStyle = "background:#FF0000";

            this.Items.Add ( new TabPanel { Items= {
                        new Ext.Net.Panel { Title="tab1",BodyStyle = "background:#00FF00" },
                        new Ext.Net.Panel { Title="tab2",BodyStyle = "background:#0000FF" } }});

            Ext.Net.Button b = new Ext.Net.Button{ID = "panel1_removeBtn",Text = "Remove this panel"};

            this.TopBar.Add(new Toolbar { Items = { b}});
        }
    }

    public class PanelType2 : Ext.Net.Panel
    {
        public PanelType2()
        {

            this.ID = "id_paneltype_2";
            this.Title = "Image " + "... Updated on " + DateTime.Now;
            this.Height = 600;
            BodyStyle = "background:#0F0FF0";
            this.Items.Add( new TabPanel { Items = {
                        new Ext.Net.Panel { Title="Online",BodyStyle = "background:#00FF00" },
                        new Ext.Net.Panel { Title="Offline",BodyStyle = "background:#0000FF" } }});

            Ext.Net.Button b = new Ext.Net.Button { ID = "panel2_removeBtn", Text = "Remove" };

            this.TopBar.Add(new Toolbar { Items = { b } });

            //////////////////////////////////////////////////////////////////////////////////////////////
            // Removing of this line makes application to work 
            this.Items.Add(new Ext.Net.Panel { Title = "Info", BodyStyle = "background:#F0F0F0" });
            //////////////////////////////////////////////////////////////////////////////////////////////
        }
    }

    public partial class _Default : System.Web.UI.Page
    {
        public static int showtype=1;

        protected void Page_Load(object sender, EventArgs e)
        {
            Button1.DirectEvents.Click.Event += AddNewPanel_1;
            Button2.DirectEvents.Click.Event += AddNewPanel_2;
            Button3.DirectEvents.Click.Event += AddNewPanel_1_1;

            AddPanel(false);
        }


        protected void RemoveCurrentPanel()
        {
            id_container.Remove(id_container.Items[0].ID);
            id_container.DoLayout();
        }

        protected void AddNewPanel_1(object sender, DirectEventArgs e)
        {
            RemoveCurrentPanel();
            showtype = 1;
            AddPanel();
        }
        protected void AddNewPanel_1_1(object sender, DirectEventArgs e)
        {
            RemoveCurrentPanel();
            showtype = 3;
            AddPanel();
        }
        
        protected void AddNewPanel_2(object sender, DirectEventArgs e)
        {
            RemoveCurrentPanel();
            showtype = 2;
            AddPanel();
        }


        public void AddPanel(bool DoRendering = true)
        {

            if (showtype == 1)
            {
                PanelType1 panel = new PanelType1(1);
                id_container.Items.Add(panel);
                if (DoRendering)
                    panel.Render();

            }
            else if (showtype == 2)
            {
                PanelType2 panel = new PanelType2();
                id_container.Items.Add(panel);
                if (DoRendering)
                    panel.Render();
            }
            else if (showtype == 3)
            {
                PanelType1 panel = new PanelType1(2);
                id_container.Items.Add(panel);
                if (DoRendering)
                    panel.Render();
            }

            id_container.DoLayout();
        }
    }
}
    Last edited by Daniil; Aug 10, 2011 at 8:03 PM. Reason: [FIXED]
  2. #2
    Aug 10, 2011, 8:43 AM
    Try to set AjaxViewStateMode="Enabled" for ResourceManager
  3. #3
    Aug 10, 2011, 8:49 AM
    Hello Vladimir,

    Thank you for your reply. I already tried this, but dont help.
    But i have another solution, at least for now it works.
    Adding of EnableViewState = false for panels work perfect, but in this case, other elements dont keep
    values, i.e. if i have edit controls or buttons, they loose data. For them i should specify EnableViewState = true.
    Then thinks work ok. Now code for panel2 for example looks like this :

     public class PanelType2 : Ext.Net.Panel
    {
        Ext.Net.Button bTn1;
        public PanelType2()
        {
            this.ID = "id_paneltype_2";
            this.Title = "Image " + "... Updated on " + DateTime.Now;
            this.Height = 600;
            this.EnableViewState = false;
            BodyStyle = "background:#0F0FF0";
            this.Add( new TabPanel { EnableViewState=true,Items = {
                        new Ext.Net.Panel { ID="id_infopan2",Title="Online",BodyStyle = "background:#00FF00" },
                        new Ext.Net.Panel { ID="id_infopan3",Title="Offline",BodyStyle = "background:#0000FF" } }});

            //////////////////////////////////////////////////////////////////////////////////////////////
            // Removing of this line makes application to work 
            this.Add(new Ext.Net.Panel { EnableViewState = true, ID = "id_infopan1", Title = "Info", BodyStyle = "background:#F0F0F0" });
            //////////////////////////////////////////////////////////////////////////////////////////////

            bTn1 = new Ext.Net.Button { ID = "panel2_btnHelp", Text = "Help", EnableToggle = true, Pressed = false };
            bTn1.DirectEvents.Click.Event += btn2_click;
            this.TopBar.Add(new Toolbar { ID = "id_infopan4", EnableViewState=true , Items = { bTn1 } });

        }
     
        public void btn2_click(object sender, DirectEventArgs e)
        {
            return;
        }

    }
    I'm not sure if this is a correct way, but it works. Seems like Remove function for panels keep some data in viewstate bag,
    that should be removed by idea.

    Regards,
    Nedelcho
    Last edited by decho; Aug 10, 2011 at 8:52 AM.
  4. #4
    Aug 10, 2011, 9:16 AM
    Hi all,

    The thread is related to:
    http://forums.ext.net/showthread.php?14952
  5. #5
    Aug 10, 2011, 2:35 PM
    Another think is that in this way, direct methods dont work at all.
    Even adding of 

        protected override void OnLoad(EventArgs e)
        {
            if (!Ext.Net.X.IsAjaxRequest)
            {
                ResourceManager.AddDirectMethodControl(this);
            }
        }
    cause blank page, and controls are not created
  6. #6
    Aug 10, 2011, 3:10 PM
    My mistake , its work perfect. I forgot to add
    base.OnLoad

Similar Threads

  1. [FIXED] [1.0] Floating attribute not being emitted for panels
    By reverseblade in forum Bugs
    Replies: 2
    Last Post: Nov 20, 2011, 11:45 AM
  2. Bug with dynamic panels and slider control
    By decho in forum 1.x Help
    Replies: 7
    Last Post: Sep 09, 2011, 8:13 AM
  3. Bug with dynamic Add/Remove of panels
    By decho in forum 1.x Help
    Replies: 7
    Last Post: Aug 10, 2011, 10:16 AM
  4. [FIXED] [1.0] MouseDistanceSensor does not work with panels
    By michaeld in forum Bugs
    Replies: 2
    Last Post: Jan 11, 2011, 12:28 PM
  5. Issues with dynamic IDs and tab panels
    By mindcore1 in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Dec 21, 2008, 4:41 PM

Tags for this Thread

Posting Permissions