Setting a Div to hide via Javascript, but is displayed after a post back

Hi Experts,

I have aspx page (using master pages)  with an ascx control on it.  I have 2 Divs {1 one for the ascx and another with some text boxes and labels.   I also have an HTML button that triggers a Javascript function to toggle the display of the ascx control.  

The process should be:
1.      The page loads and the ascx control is Hidden.  The users Presses the HTML button to display the control. The ascx displays some suppliers.
2.      The control will perform a postback to load the second Div with some text info after the user selects an supplier.
3.      The user may choose to hide the ascx and press the HTML button.
4.      The javascript function will hide the ascx.
My problem is that after selecting a supplier and a postback occurs, the control is hidden, without pressing the HTML button. This is because the   I tried using a hidden field on the aspx page and loading it in the javascript but the postback resets the hidden value to zero.    I can work around with serverside code but I would like to toggle the hidding of the control on the client if possible.

In this example I am using verbose Javascript.   I admit It looks a little like counting cows by adding up the legs and dividing by 4 but my Javascript is a little weak :(

Thanks in advance!

<script type="text/javascript">
    window.onload = init;
    function init() {
        DspSuppliersSelect(0);
    }
</script>
var elem;
function DspSuppliersSelect(inpval) {

 if (inpval == 0){
      elem = 0;
}
Else
 {
     elem = document.getElementById("hidSelectSupplyDsp").value;
  }

 
    var oBtnSupplier = document.getElementById("btnSuppliers");
    if (oBtnSupplier)    
       {
         var oSupplierSelect = document.getElementById("DivSupplierSelect");
          if (oSupplierSelect)
            {    
               if (elem == 1)
                {
                     if (oBtnSupplier.value == "Select Suppliers")
                      {
                        oBtnSupplier.value = "Hide Suppliers";
                        oSupplierSelect.style.display = "block";
                       }
                     else
                       {
                           oBtnSupplier.value = "Select Suppliers";
                           oSupplierSelect.style.display = "none";
                       }    
                  }
                  else
                  {
                     if (oBtnSupplier.value == "Select Suppliers") {
                         oSupplierSelect.style.display = "none";                  
                  }
                      else
                  {
                          oSupplierSelect.style.display = "block";                  
                  }                  
               }    
            }
        }


        document.getElementById("hidSelectSupplyDsp").value = 1;
        elem = document.getElementById("hidSelectSupplyDsp").value;
         
}


<div >
    <input id="hidSelectSupplyDsp" type="hidden" value=0 />
 
        <input id="btnSuppliers" type="button" value="Select Suppliers"          
                                               onclick="DspSuppliersSelect()" />
    </div>
    <div id="DivSupplierSelect" style="display: none; border: thin inset #C0C0C0;">
        <uc2:SelectSuppliers ID="ucSelectSupplier" runat="server"
                         OnSuppSelected="ucSelectSupplier_SuppSelected"  
                         OnSuppSearched="ucSelectSupplier_SuppSearched" />
     </div>

<div id=”SupDisplay” >
 ….
</div>      
nowmbieAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

MlandaTCommented:
the display property is not maintained across postback.
what you may do is have a hiddden textbox or hidden field, set it's value to whatever you set the .display of the div. the value of the postback is maintained during postbacks. then in the page_prerender event; you set the display attribute of the panel (if you are using a panel to create the div) or otherwise... use a code block to write out the value that's in the textbox on the display property of teh div.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
nowmbieAuthor Commented:
Hey thanks.
The best solution for me is to use cookies.  Although You must be careful when using cookies because IE may not really delete the cookies until the browers is closed and reopend.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.