SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Javascript Array

    Hello,

    I'm a bit new to using an array so hopefully I didn't screw this up too much.

    What I'd like to do is have an array in javascript create a navigation for a website I'm doing. I would like the navigation to remain somewhat dynamic so I didn't use a numeric array for that reason.

    My question is, I'm trying to use a two-dimensional array (at-least that's what I think it is) which is basically the navigation menu and sub-menu. If I were to alert "nav[1].nav_title" I'll get: "Services", but what if I want to get the sub-nav to "Services"? I've tried "nav[1][1].nav_title" but it doesn't work.

    Any Ideas?



    //build nav
    function Nav(arr_nav_title)
    {
    this.nav_title = arr_nav_title;
    this.nav_href = Nav_href(arr_nav_title);
    }



    //build sub-nav
    function SubNav(arr_nav_title)
    {
    this.nav_title = arr_nav_title;
    this.nav_href = Nav_href(arr_nav_title);
    }



    //build nav array
    var nav = new Array();

    nav = [

    new Nav ('Home'),

    new Nav ('Services',
    new SubNav ('Strategic Planning', 'Capture Planning', 'Proposal Development', 'BD Process Consulting') ),

    new Nav ('About Us',
    new SubNav ('Qualifications', 'Markets Supported', 'Subsidiaries') ),

    new Nav ('Contact Us')

    ];



    //create nav href
    function Nav_href(title)
    {
    var href_lc = title.toLowerCase();
    var href = href_lc.replace(/ /, '_');

    return href;
    }

  2. #2
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,192
    Mentioned
    17 Post(s)
    Tagged
    4 Thread(s)
    Could it be the fact that your passing two parameters to the Nav function without declaring the second as an argument?

  3. #3
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have two different functions. One for the main menu one for the sub-menu. If there's a better way to write out the array please point it out. Like I said, I'm new at arrays.

  4. #4
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,192
    Mentioned
    17 Post(s)
    Tagged
    4 Thread(s)
    Your arguments after the first aren't being passed either in all the object declarations. You need to create a loop that goes through all the arguments to assign each argument.

  5. #5
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,192
    Mentioned
    17 Post(s)
    Tagged
    4 Thread(s)
    Code:
    /*Creates root object with title and link arrtibutes*/
    
    function Root(title,sub) {
      this.title = title;
      this.link = link(this.title);
      if(sub) { //checks to see if there is a sub menu if so then its processed
        this.sub = new Array();  
        for(x in sub) {
          this.sub[x] = new Root(sub[x]); //recursive call
        }
      }
    }
    
    /*Return lowercase link attribute*/
    function link(page) {
      var href = page.replace(/ /, '_');
      return href.toLowerCase();
    }
    
    window.onload = function() {
      CreateNav();
    }
    
    /*Puts together Navigation Menu*/
    function CreateNav() {
    var Nav = [ new Root("Home"),new Root("About Us", ['Qualifications', 'Markets Supported', 'Subsidiaries']),new Root("Services",['Strategic Planning', 'Capture Planning', 'Proposal Development', 'BD Process Consulting']),new Root("Contact")];
    alert(Nav[2].sub[1].link)
    }
    There are problems but, this works.

    More particularly I forgot how to do this but, in the Root function you should check to see if sub is a array. Currently it only check to see if its there. However it should be something like if(sub is an array) {then do this recursive loop}; If you need any further explanation I'll elaborate.

    The main this to remember is the arguments for the Root function. The title argument is the title(string) of the root menu. For example, if a menu is named Services then new Root("Services") is the appropriate pass. However, the second argument is an array of the subdirectory names. for example:

    Code:
    var menu-option = new Root("About Us", ['Qualifications', 'Markets Supported', 'Subsidiaries'])
    That would initiate an object of type Root named menu-option. That object would hold a link, title and sub property. The sub property holds an array of Root objects dependent on how many sub categories are passed in the initial array.

    Hope that helps.
    Last edited by oddz; Aug 8, 2007 at 20:06.

  6. #6
    I'm not a human
    Join Date
    Aug 2006
    Location
    India
    Posts
    281
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hi

    From the code you posted i think u want to create a dropdown menu,

    why don't u try the free menu creating tool like the one at

    http://www.hscripts.com/tools/drop-down-menu/index.php

    If u intending to create a normal drop down menu it's very easy else if you want something different then you can try any other thing..

    I use this tool to create a menu and as it's a open source and free ware i use to edit to my need for configuring color, font etc..

    I think it would be useful.
    Regards,
    Vijay
    Follow me on twitter @vijaycbe
    World Holiday Calander || My Cricket Blog


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
  •