I have a DIV that I’m hiding using an image’s onclick event. There is a SQL where clause filter in the DIV with many controls that could be visible or hidden based on user selection. When I click the image to hide the DIV some of the controls remain visible.
Any ideas why this is occurring?
function displayFilter() { if (document.getElementById("<%=div_filter.ClientID %>").style.visibility == "hidden" || document.getElementById("<%=div_filter.ClientID %>").style.visibility == "") { document.getElementById("<%=imgFilter.ClientID %>").title = "Hide filter..."; document.getElementById("<%=div_filter.ClientID %>").style.visibility = "visible"; document.getElementById("<%=div_filter.ClientID %>").style.height = "100px"; } else { document.getElementById("<%=imgFilter.ClientID %>").title = "Show filter..."; document.getElementById("<%=div_filter.ClientID %>").style.visibility = "hidden"; document.getElementById("<%=div_filter.ClientID %>").style.height = "0px"; } }
hi sir,
For this issue, I think you may pay attention about how to hidden and show the Div. There is a simple code, please view it:
<head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> $(document).ready(function () { $("#hide").click(function () { $("#cont").hide(); }); }); </script> </head> <body> <div id="cont" style="width:200px;height:300px;background-color:">If you click on the image, I will disappear.</div> <asp:Image ID="hide" runat="server" ClientIDMode="Static" Width="50" Height="50" ImageUrl="~/1.PNG"></asp:Image> </body>
In this code, I used the jquery hidden method, I suggest you could refer to this document:
http://www.w3schools.com/jquery/jquery_hide_show.asp
By the way, I also recommend you can consider some jquery plugin and its API,http://api.jquery.com/hide/
Regards,
Will