Hide / Display DIV on Dropdown list change event - ASP.NET

	Find Code:
Home : Code : Forums : Submit : Mailing List : About : Contact

All

VB.NET

ASP.NET

C#

Snippets

Popular

Forums

Articles

Tips

Links

Books

Contest

Hide / Display DIV on Dropdown list change event
Author: Vinayak Butale
E-mail: Click to e-mail author
Website: http://intellect-systems.com
Submitted: 9/24/2012
Version: ASP.NET 2.0
Compatibility: ASP.NET 2.0, ASP.NET 3.5
Category: Forms
Views: 8944
Sometimes we need to Hide / Display DIV at client side (Without post back). Even this can be managed during drop down list change event in Asp.Net.
Declarations:
'none
Code:
<script type="text/javascript"> function hideBottonDiv() { var parm = document.getElementById("SearchOptionsDropDownList"); var lData = parm.options[parm.selectedIndex].value switch(lData) { case "1": document.getElementById("listVisit").style.display = 'none'; return; case "2": document.getElementById("listVisit").style.display = 'block'; return; } } </script> <form id="form1" runat="server"> <div id="listVisit" style="display: none;"> <h1>Sample HEader</h1> <p>At Varad multiservices we need people with extra ordinary imagination power and creative thinking. The industry requires people who can do more than just coding. Solutions to all kind of problems in the most optimum way is what makes an individual stand out of the ordinary; this is only possible for someone who dares to think out of the box</p> </div> <asp:DropDownList ID="SearchOptionsDropDownList" runat="server" onchange="hideBottonDiv()" > <asp:ListItem Text="Item 1" Value="1" /> <asp:ListItem Text="Item 2" Value="2" /> </asp:DropDownList> </form>