Search
Tuesday, November 20, 2018 ..:: Home ::.. Register  Login
   Calendar  
     
  
   Search  
     
  
   Blogroll  
     
  
   Disclosure  
All blog entries are the opinions of the author and do not necessarily reflect the opinions of their employer. All the code presented is for explanation and demonstration purposes only. Any damages incurred to your site and/or data are not the responsibility of the author. Every effort is taken to ensure the code properly compiles, however sometimes there are some hiccups and you might be required to do your own debugging.
     
  
   TechTidBits (Blog)  

You can create a Web User Control, but can you hide it now?

Sep 16

Written by:
Tuesday, September 16, 2008 10:46 PM  RssIcon

Have you ever had to create a web User Control and dynamically show/hide stuff in it?  Have you had issues with it?  I have the solution here, and it's easier than you think! :>

In my last ODNC web study group session, we learned about creating and using Web User Controls.  This is really cool stuff, and I encourage you to play around with creating/using web User Controls.  But the issue I would like to focus on is showing/hiding content dynamically. 

Ready for the secret, here it is: html table rows!  Yup, simple tags!  If you don't believe me, check out the sample code at the end of the blog entry and try it out.  There are a few other gems in there as well (like event bubbling). 

To expand a bit more, if you want to show/hide an image for example, you would place the img tag in a

<table>
    <tr id="trLogoImage" runat="Server"> <%--this line is one piece of the magic--%>
        <img src="~/CompanyLogo.png" alt="The best place to work ever! :>">
  </tr>
</table>


And then in code, where appropriate (in a _Click, or page load, etc) you would set the visibility of the trLogoImage appropriately.  This is the second piece of this magic.

The reason why this works is if you make the img tag a server side control (with id and runat attributes) you'll still have space around it when your browser renders the html.  Therefore it could pose problems with lining things up and making your UI neat and clean.  This is an easy fix, especially if you already have the tags in place already, you just have to make the server side controls with ID and runat attributes.

The code will generate a Default.aspx which will look like this.

Screencap of Default.aspx

I hope you'll be able to use this little trick in the future to show/hide your UI controls.  Enjoy.


Resources: Download sample project

Tags:
Categories:
Location: Blogs Parent Separator TechTidBits

Your name:
Gravatar Preview
Your email:
(Optional) Email used only to show Gravatar.
Your website:
Title:
Comment:
Add Comment   Cancel 
     
  
Copyright 1999-2012 by PCHenry.com   Terms Of Use  Privacy Statement