iterate through nested form elements in jquery

Question

im sorry if this was posted already i have been looking to no avail..

I just want to know how to loop through nested form \'elements\' (elements being not only the s

Answer 1

Came back to correct myself :) jQuery Rocks! So after a crash course here is the same thing in jQuery ...

/*
    menu.jq     : main menu jQuery for ekerner.com
    Author      : 'Eugene Kerner' 
    Date        : 16-12-2009
    Dependencies: jQuery javascript lib
                : menu.css
                : an unordered list structure as per the below Example.
                : a javascript call to menu.init(menuId, selectedMenuItemsArray) as per the below Example.
    Notes       : if your menu link has an onclick that returns false then it needs to call menu.init before returning (see Example).
    Example     : -
    

      

        Menu Item
        

          
Sub Menu Item
        
      
    
    
*/

var menu = {
  selectedClass : 'selected',
  animateSpeed  : 'fast',
  selectedLinks : [],
  init : function(menuId, selectedLinks)
  {
    $('#' + menuId).children('li').each(function(){
      var menuItem       = $(this);
      var menuLink       = menuItem.children('a:first-child');
      var subMenu        = menuItem.children('ul:last-child');
      menu.selectedLinks = selectedLinks;
      menu.applySelectedClass(menuLink);
      if (subMenu.length == 1) {
        menuItem.hover(
          function(){menuLink.addClass(menu.selectedClass); subMenu.slideDown(menu.animateSpeed)}, 
          function(){subMenu.slideUp(menu.animateSpeed); menu.applySelectedClass(menuLink)}
        );
        subMenu.find('a').each(function(){menu.applySelectedClass($(this))});
      }
    });
  },
  applySelectedClass : function(menuLink)
  {
    ($.inArray(menuLink.html(), menu.selectedLinks) > -1) ? menuLink.addClass(menu.selectedClass) : menuLink.removeClass(menu.selectedClass);
  }
}

And here is the css in case anyone wants to make use of it ...

/*
    menu.css - main menu cascading style sheet for ekerner.com all media
    'Eugene Kerner' 
    14-12-2007
*/

.menuItems, .menuItems li, .menuItems li ul, .menuItems li ul li {
  padding: 0;
  margin: 0;
}
.menuItems, .menuItems li ul {
  list-style: none;
}
.menuItems {
  background: url(/shared/images/menu/menu_button_bg.png) repeat-x;
  height: 30px;
}
.menuItems:after { 
  content: ".";
  height: 0; 
  clear: both; 
  display: none;
}
.menuItems li {
  width: 80px;
  float: left;
}
.menuItems li a {
  color: #0d2a86;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  height: 24px;
  padding-top: 6px;
  border-right: 1px solid #f3f3f3;
  display: block;
}
.menuItems li a:hover, .menuItems li .selected {
  background: url(/shared/images/menu/menu_button_bg_selected.png) repeat-x;
  color: #518ed3;
}
.menuItems li ul {
  position: absolute;
    z-index: 100;
    border: 1px solid #e0e7ef;
    border-top: 0;
  display: none;
}
.menuItems li ul li {
  width: 77px;
  clear: both;
}
.menuItems li ul li a {
  background: #f3f3f3;
  font-size: 12px;
  font-weight: normal;
  height: 18px;
  padding: 0;
  padding-top: 2px;
  border: 0;
}
.menuItems li ul li a:hover, .menuItems li ul li .selected {
  background: #e0e7ef;
}
.visible {
  display: block;
}
.hidden {
  display: none;
}