For the last time. Panels Render Mark-up!

If I had a penny for each time I encounter this kind of mark-up in an ASP.Net Web Form...

<asp:Panel runat="server" ID="PanelFooContainer" Visible="true">
   <div id="FooContainer">
       Foo bar baz
   </div>
</asp:Panel>

...I'd be a few quid better off. I've also seen the following a few times which makes me feel a little unwell.

<table>
   <tr>
       <th>Foo</th>
   </tr>
   <asp:Panel runat="server" ID="PanelFooContainer" Visible="true">
       <tr>
           <td>bar baz</td>
       </tr>
   </asp:Panel>
</table>

What's wrong with this? Well, this mark-up renders the following HTML to the browser:

    <table>
       <tr>
           <th>Foo</th>
       </tr>
       <div id="PanelFooContainer">
           <tr>
               <td>bar baz</td>
           </tr>
       </div>
   </table>

Which, I am sure you will agree, is a pigs ear. Oh, and it's invalid HTML.

I'm sure most developers guilty of this do not intend to render that additional mark-up - they just want a control which they can show or hide easily from the code. But if all you require is a control that you can work with in your code then simply use a PlaceHolder control that doesn't render any superfluous mark-up.

Your mark-up will be valid, you will feel warm and cosy and your code will probably remain exactly the same.

Published: Thursday, 14 May 2009 08:11 PM by Steve

Tags: ASP.Net

Comments: 0 Comments

Search Blog

Browse By Tag

ASP.Net Blogger Ext JS Gotcha JavaScript jQuery Linq MVC News Nonsense Telerik

Archive