Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Jan 2004
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    javascript tree open by default issue

    I have a javascript tree menu that opens different folders. But, the folders close when the page is reloaded. I want to enable the script to keep the folder open until you click it again to close it. Here is the code on the html page to display a portion of the menu:
    PHP Code:
    <table border=0 cellpadding='1' cellspacing=1>
      <
    tr>
        <
    td width='16'>
        <
    a id="xproducts\" href=\"javascript:Toggle('products');\">
        <img src='$App_URL/images/folder.gif' width='16' height='16' hspace='0' vspace='0' border='0'>

        </a>
        </td>
        <td>
        <b>Products</b>
        </td>  <!--- this one -->
      </tr>
    </table>

        <div id=\"products\" style=\"display: none; margin-left: 2em;\">

    <table border=0 cellpadding='1' cellspacing=1>
      <tr>
        <td width='16'>
        <img src='$App_URL/images/text.gif' width='16' height='16' hspace='0' vspace='0' border='0'>
        </td>
        <td>
        <a href=\"index.php?LoadModule=add_products&Panel=Add_Page_1\"><font face=\"verdana\" size=\"-2\">Add</font></a>
        </td>

      </tr>
    </table>

    </div> 
    And here is the actual javascript to open/close it:


    PHP Code:

    function Toggle(item) {
       
    obj=document.getElementById(item);
       
    visible=(obj.style.display!="none")
       
    key=document.getElementById("x" item);
       if (
    visible) {
         
    obj.style.display="none";
         
    key.innerHTML="<img src='../images/folder.gif' width='16' height='16' hspace='0' vspace='0' border='0'>";
       } else {
          
    obj.style.display="block";
          
    key.innerHTML="<img src='../images/textfolder.gif' width='16' height='16' hspace='0' vspace='0' border='0'>";
       }
    }

    function 
    Expand() {
       
    divs=document.getElementsByTagName("DIV");
       for (
    i=0;i<divs.length;i++) {
         
    divs[i].style.display="block";
         
    key=document.getElementById("x" divs[i].id);
         
    key.innerHTML="<img src='../images/textfolder.gif' width='16' height='16' hspace='0' vspace='0' border='0'>";
       }
    }

    function 
    Collapse() {
       
    divs=document.getElementsByTagName("DIV");
       for (
    i=0;i<divs.length;i++) {
         
    divs[i].style.display="none";
         
    key=document.getElementById("x" divs[i].id);
         
    key.innerHTML="<img src='../images/folder.gif' width='16' height='16' hspace='0' vspace='0' border='0'>";
       }


  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,032
    Thanks
    0
    Thanked 248 Times in 245 Posts
    You have to save the opened folders in a cookie to make the browser remember them being opened.

    FYI, beetle, one of the members here, has created a tree view script he called NavMenu and he plans to incorporate persistence in the future. Just for your future reference.

  • #3
    New to the CF scene
    Join Date
    May 2004
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Macintosh

    hello..
    I am new in web programming. Is it posibble to change "the image button" in tree navigation menu (key.innerHTML="<img src="image.gif">") by simply reffering this button to the word that we use as hyperlink?
    thanks.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •