[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

Javascript Hide <DIV>

Posted on 2007-03-20
2
Medium Priority
?
302 Views
Last Modified: 2010-04-16
I need some help with Javascript.  I want two buttons at the top of the page to close and open specific div tags in the page.  Here's the javascript i'm using:
     <script language="javascript">
          function EditSettings()
      {
      if(document.getElementById)
          {
            document.getElementById("ShowSettings").style.display ="block";
            document.getElementById("ShowEditPages").style.display ="none";
           }
      if(document.all)
         {
           document.all["ShowSettings"].style.display ="block";
           document.all["ShowEditPages"].style.display ="none";
          }
                      }
      function EditPages()
      {
        if(document.getElementById)
           {
             document.getElementById("ShowSettings").style.display ="block";
             document.getElementById("ShowEditPages").style.display ="none";
           }
        if(document.all)
          {
            document.all["ShowSettings"].style.display ="block";
            document.all["ShowEditPages"].style.display ="none";
          }
      }
</script>
The HTML Is basically this:
       <input type="button" value="Set Base Options" onClick="javascript:EditSettings();">
                     <input type="button" value="Edit Pages" onClick="javascript:EditPages();">
<div id="ShowSettings" style="DISPLAY: block">
   Setting Info Goes Here
</div>
<div id="ShowEditPages" style="DISPLAY: none">
   Edit Page info goes Here.
</div>

I'm not fluent in javascript by any stretch of the imagination, but I thought this was the way you accomlished this.  Its not!  Any help would be appreciated.

Thanks

0
Comment
Question by:steverguy
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
2 Comments
 
LVL 54

Accepted Solution

by:
b0lsc0tt earned 2000 total points
ID: 18776125
The problem was basically a mistake in the code.  Both functions did the same thing, the default.  I don't know if I made the right correction but I changed the EditPages function so it would show the edit pages div and hide the settings (default) div.

function EditSettings()
      {
      if(document.getElementById)
            {
              document.getElementById("ShowSettings").style.display ="block";
              document.getElementById("ShowEditPages").style.display ="none";
            }
      if(document.all)
         {
           document.all["ShowSettings"].style.display ="block";
           document.all["ShowEditPages"].style.display ="none";
          }
      }
function EditPages()
      {
        if(document.getElementById)
           {
             document.getElementById("ShowSettings").style.display ="none";
             document.getElementById("ShowEditPages").style.display ="block";
           }
        if(document.all)
          {
            document.all["ShowSettings"].style.display ="none";
            document.all["ShowEditPages"].style.display ="block";
          }
      }

That simple change will give you results.  You may just have to reverse them to get the ones you want. :)

I usually suggest you don't set the display value if you are just using the default.  For example in the script replace "block" with just "".

            document.all["ShowEditPages"].style.display ="";

In the div tag use the code below if you want the div to display by default.

<div id="ShowSettings">

Let me know how that works or if you have a question.

bol
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 18866365
I'm glad that helped.  Thanks for the grade, the points and the fun question.

bol
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

If you get a (Blue Screen of Death), your system writes a small file called a minidump. Your first step is to make certain your computer is setup to record memory dumps. Right click My Computer, choose properties. Click on the advanced tab, an…
Making a simple AJAX shopping cart Couple years ago I made my first shopping cart, I used iframe and JavaScript, it was very good at that time, there were no sessions or AJAX, I used cookies on clients machine. Today we have more advanced techno…
Learn the basics of if, else, and elif statements in Python 2.7. Use "if" statements to test a specified condition.: The structure of an if statement is as follows: (CODE) Use "else" statements to allow the execution of an alternative, if the …
In a recent question (https://www.experts-exchange.com/questions/29004105/Run-AutoHotkey-script-directly-from-Notepad.html) here at Experts Exchange, a member asked how to run an AutoHotkey script (.AHK) directly from Notepad++ (aka NPP). This video…
Suggested Courses

650 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question