SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Jan 2009
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    nested ul menu - pass variables between windows?

    nested ul menu - pass variables between windows?

    Hi all

    I have a simple ul menu with nested ul menus here

    http://www.ttmt.org.uk/forum/reload/

    When the page loads the nested menus are hidden.

    When the parent links are clicked I want them the nested ul to slidedown
    and show the menu.

    The first link 'One' is connected to another page, when it's clicked I want it's nested
    menu to appear when the new page loads.

    I'm thinking the only way to do this is pass a variable to the new page so it's knows which nested menu to open.

    Is this the bested way to do this or is there a better way.

    How can I pass a variable to the new page to open the nested menu.

    Code:
    <!DOCTYPE html>
    <html>
      <head>
      <title>Title of the document</title>
      
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
      <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.4.1/build/cssreset/cssreset-min.css">
      
      <style type="text/css">
        #nav{
          margin:50px;
          width:200px;
        }
        #nav li a{
          background:#aaa;
          display:block;
          padding:5px;
          margin:0 0 2px 0;
          text-decoration:none;
        }
        #nav ul li a{
          background:red;
          color:white;
          display:block;
          padding:5px;
          margin:0 0 2px 5px;
        }
        h1{
          margin:50px;
          font:bold 1.5em sans-serif;
        }
      </style>
      
      </head>
      
    <body>
    
      <h1>Home</h1>
      
      <ul id="nav">
        <li><a href="one.html">One</a>
          <ul class="children">
          	<li><a href="one.html">One/One</a></li>
          	<li><a href="#">One/Two</a></li>
          	<li><a href="#">One/Three</a></li>
          </ul>
        </li>
        <li><a href="#">Two</a></li>
        <li><a href="#">Three</a>
          <ul class="children">
      	    <li><a href="#">Three/One</a></li>
      	    <li><a href="#">Three/Two</a></li>
          </ul>
        </li>  
      </ul>
        
      <script type="text/javascript">
          
          $('#nav li ul').slideUp();
          
          $('#nav > li > a').click(function(){
            
            if ($(this).attr('class') != 'active'){
              $(this).next().slideToggle();
              $('#nav li a').removeClass('active');
              $(this).addClass('active');
            }
          });
          
        </script>
      
    </body>
    
    </html>

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,716
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Normally a page is capable of specifying which menu item is relates to, without needing to edit the menu at all.
    http://css-tricks.com/id-your-body-f...d-specificity/
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Enthusiast Angrypoonani's Avatar
    Join Date
    Mar 2011
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not extremely verbose in JS but I would pass the variable/flag with PHP using a simple $_GET and code the variables/flags you want sent to the other window into the link itself.

    something like this:

    HTML Code:
    <ul class="children>
      <li><a href="one.php?flag=clicked"></a></li>
    then on 'one.php'
    PHP Code:
    <?php
    $someData 
    $_GET['flag'];
    ?>
    From what you have posted this should work with the JQ you posted though you may need to modify it a bit. Another way may be to pass variables using a hidden form? just throwing out an idea.


Bookmarks

Posting Permissions

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