How To Easily Preserve State Of DIV (Hide/Show) Between Post-backs In ASP.NET with JavaScript

                          <p>Already have an online account? <a href="#" id="aLoginForStreamlined">Log in for a streamlined experience</a>.</p>

<div id="DivLoginForm" style="display: none">
                                       Content To Hide/Show Here!
                                    </div>
 <asp:HiddenField ID="hdnLoginFormState" runat="Server" Value="0" />
                    <script>
                        // Retain Login Form expansion/contraction state between postbacks
                        $(document).ready(function () {
                            var hdnState = $('#<%=hdnLoginFormState.ClientID %>').val();
                             if (hdnState == "0") {
                                 $("[id$='DivLoginForm']").hide();
                             }
                             else {
                                 $("[id$='DivLoginForm']").show();
                             }

                             $('a#aLoginForStreamlined').click(function () {
                                 $("[id$='DivLoginForm']").toggle();

                                 var oldValue = $('#<%=hdnLoginFormState.ClientID %>').val();
                                 var newValue = (oldValue == 0) ? "1" : "0";
                                 $('#<%=hdnLoginFormState.ClientID %>').val(newValue);
                                 return false;

                             });
                         });

                    </script>
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s