title: Displaying and hiding parts of the web form freely without limitations in order to avoid ViewState loading problems
body: <h1>The problem</h1>
  <p>I have a web form and I would like to hide and show some panels. When I say &quot;Panel&quot; I do not mean the <code>Panel</code> control but just a pane in the html (usually represented by a DIV).</p>
  <p>Well I want to show and hide this panels as I wish... no limits means that not necessarly only one pane must by visible, also 2, 3 or 4 can be.</p>
  <p>Usually I achieved this by:</p>
  <pre><code>&lt;div id=&quot;mypane1&quot; runat=&quot;server&quot;&gt;
    ...
  &lt;/div&gt;
  &lt;div id=&quot;mypane2&quot; runat=&quot;server&quot;&gt;
    ...
  &lt;/div&gt;
  &lt;div id=&quot;mypane3&quot; runat=&quot;server&quot;&gt;
    ...
  &lt;/div&gt;
  </code></pre>
  <p>and this:</p>
  <pre><code>this.mypane1.Visible = true;
  this.mypane2.Visible = false;
  this.mypane3.Visible = true;
  </code></pre>
  <p>Unfortunately these panels contain controls and some of them are not shown from the beginning (first web form load, so when no <code>PostBack</code> happens). This leads to problems for <code>ViewState</code> loading.</p>
  <h2>Regarding ViewState loading</h2>
  <p>Of course many will obviously ask about these <code>ViewState</code> problems of mine. Well, briefly, the thing is this: a <code>ViewState</code> loading error is not easy to manage but in the end I could understand the following.</p>
  <p>Let's say to have this:</p>
  <pre><code>&lt;!-- In .aspx --&gt;
  &lt;div id=&quot;mypane1&quot; runat=&quot;server&quot;&gt;
    ...
    &lt;asp:Literal ID=&quot;...&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:Literal&gt;
    &lt;asp:TextBox ID=&quot;...&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:TextBox&gt;
    ...
  &lt;/div&gt;
  &lt;div id=&quot;mypane2&quot; runat=&quot;server&quot;&gt;
    ...
    &lt;asp:LinkButton ID=&quot;lb1&quot; OnClick=&quot;lb1_Click&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:LinkButton&gt;
    &lt;asp:LinkButton ID=&quot;lb2&quot; OnClick=&quot;lb2_Click&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:LinkButton&gt;
    &lt;asp:LinkButton ID=&quot;lb3&quot; OnClick=&quot;lb3_Click&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:LinkButton&gt;
    ...
  &lt;/div&gt;
  &lt;div id=&quot;mypane3&quot; runat=&quot;server&quot;&gt;
    ...
    &lt;asp:TextBox ID=&quot;...&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:TextBox&gt;
    &lt;asp:LinkButton ID=&quot;lb4&quot; OnClick=&quot;lb4_Click&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:LinkButton&gt;
    &lt;asp:TextBox ID=&quot;...&quot; runat=&quot;server&quot; ...&gt;&lt;/asp:TextBox&gt;
    ...
  &lt;/div&gt;
  
  // In .aspx.cs
  protected void Page_Load(...) {
    if (!this.IsPostBack) {
      this.mypane1.Visible = true;
      this.mypane2.Visible = false;
      this.mypane3.Visible = true;
    }
  }
  
  /// ... In the page many happens and the panes are shown and hidden ... ///
  
  // Event Handlers
  protected void lb1_Click(object sender, EventArgs e) {
    ...
  }
  protected void lb2_Click(object sender, EventArgs e) {
    ...
  }
  protected void lb3_Click(object sender, EventArgs e) {
    ...
  }
  protected void lb4_Click(object sender, EventArgs e) {
    ...
  }
  </code></pre>
  <p>Well the problem is the following.</p>
  <ul>
  <li><p>At the beginning pane2 is not shown.</p>
  </li>
  <li><p>After some actions pane2 is shown and its controls are shown too.</p>
  </li>
  <li><p>User click lb1 --&gt; <code>ViewState error</code></p>
  </li>
  </ul>
  <p>Note that the same happens for every event associated to pane2's controls. Is lb4 is pressed, no problems.</p>
  <p>The problem is that the beginning hierarchy is represented by controls in pane 1 and 3. When events are raised by controls not part if the beginning hierarchy, <code>ViewState</code> is found inconsistent (because I act on <code>HtmlControls</code>, usually <code>ServerControls</code> are more intelligent and can manage better ViewState when controls are added inside them).</p>
  <h2>Feasible solutoions</h2>
  <p>Note that I could simply do the following to hide and show panels:</p>
  <pre><code>this.mypane2.Attributes.Add(&quot;display&quot;, &quot;none&quot;);
  </code></pre>
  <p>This is not something I would like to do for two reasons:</p>
  <ul>
  <li><p>I want panes not to be rendered as Html.</p>
  </li>
  <li><p>I would like to use server controls.</p>
  </li>
  </ul>
  <h1>Request</h1>
  <p>I need to use web controls to manage my panel management, I cannot use <code>HtmlControl</code>s because Control Hierarchy is not correctly loaded.</p>
  <p>I tried <code>MultiView</code> and View controls but they enable me to use only one active view. How can I do?</p>
  <p>Note: Please do not focus too much on the <code>ViewState</code> problem, it is just a good desc to let you know what happens, my only interest is to find a way to hide and show panes freely using server controls.</p>
  <p>Thankyou</p>