Client side show/hide div

On the page I have a div:

<div id="DivAddress" runat="server">
   some content here
</div>
I want the div to be hidden when the page loads, therefore at the end of the page I run:
<script type="text/javascript">
$(document).ready(function(){
$("#<%= this.DivAddress.ClientID %>").css({
"display": "none"
});
});
</script>
Below that div there are also buttons which hide or show that div by setting the display to none or block in a similar way (this example uses jquery, but I also used traditional ways).
all works fine, except that the state of the display property is not persisted between postbacks (it always appears visible after postback, as the script above runs only once - the page uses a master page with an UpdatePanel).
How do I persist the state between postbacks?
0
tsw_mik
4/30/2009 2:12:24 PM
📁 asp.net.client-side
📃 24353 articles.
⭐ 2 followers.

💬 3 Replies
👁️‍🗨️ 1727 Views



try this script, if you have any control inside that div, you can also hide it.
<script>
if (document && document.getElementById)
{
var myControl = document.getElementById("myControl");
var myOtherControl = document.getElementById("myOtherControl");
if (myControl && myOtherControl)
{
myControl.style.visibility = "visible";
myControl.style.position = "relative";
myOtherControl.style.visibility = "hidden";
myOtherControl.style.position = "absolute";
}
}
</script>

MARK AS ANSWER IF MY POST HELPED YOU! 
THIS REDUCES TIME FOR OTHERS..!
0
SurendraKishore
4/30/2009 2:22:06 PM
Hello tsw_mik

 
In this scenario, you can use server-side HiddenField to maintain the state on client-side, please refer to the following tutorial:
 
<i style="mso-bidi-font-style:normal;">[How Do I:] Use a Hidden Field to Store and Manipulate Client-Side Information
http://www.asp.net/Learn/videos/video-384.aspx
 
Thanks.
 

Lance Zhang
Microsoft Online Community Support

Please remember to mark the replies as answers if they help and unmark them if they provide no help.
0
Lance
5/4/2009 7:59:54 AM

Hi tsw_mik,
You have to maintain display property of div by string it's current property in hidden html field. Please look at the following example.
 
&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;
&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; &gt;
&lt;head runat=&quot;server&quot;&gt;
    &lt;title&gt;Hide Show&lt;/title&gt;
    &lt;script type=&quot;text/javascript&quot;&gt;
    function HideShow()
    {
        if (document.getElementById(&#39;divHideShow&#39;).style.display == &#39;none&#39;)
        {
            document.getElementById(&#39;divHideShow&#39;).style.display = &#39;&#39;
        }
        else
        {
            document.getElementById(&#39;divHideShow&#39;).style.display = &#39;none&#39;
        }
        document.getElementById(&#39;hdnState&#39;).value = document.getElementById(&#39;divHideShow&#39;).style.display;
    }
    &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;form id=&quot;form1&quot; runat=&quot;server&quot;&gt;
    &lt;input type=&quot;hidden&quot; runat=&quot;server&quot; id=&quot;hdnState&quot; value=&quot;&quot; /&gt;
    &lt;div id=&quot;divHideShow&quot; runat=&quot;server&quot;&gt;Hide Show&lt;/div&gt;
    &lt;a href=&quot;javascript:;&quot; onclick=&quot;HideShow();&quot;&gt;Test&lt;/a&gt;
    &lt;/form&gt;
 &lt;/body&gt;
&lt;/html&gt;

  Now at server side add this
 
    Private Sub Page_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender
        divHideShow.Style.Add(&quot;display&quot;, hdnState.Value)
    End Sub
  

Please mark as Answer if it helps u. Thanks!

Parth Patel
Techsture Technologies
Software Developer
Ahmedabad
0
Coool
5/4/2009 12:27:42 PM
Reply: