Results 1 to 9 of 9

Thread: Making navigation easier to update, using JS?

  1. #1
    Join Date
    Jul 2010

    Making navigation easier to update, using JS?

    Hi there, I am trying to make updating a navigation simpler, I have a simple basic dropdown (form) menu on my website that appears on each page, whenever I want to add a page or alter it I have to edit each page and I was wondering if there was a way possibly using javascript (I'm a complete JS n00b but enthusiastic and want to learn) to somehow tackle this problem, maybe having a javascript file or two I can simply update that will change the dropdowns on each page, possible?

    I had a bit of a go here: http://www.amythornley.co.uk/test.html

    but as you can see it doesn't even load the aboutme page, any idea why? and I would still need to update every page to add a new link anyway!

    Here's my website to see the sort of thing I want to do: http://www.amythornley.co.uk/

    Any help is appreciated, just for ease of use more than anything, Also would like to start learning Javascript and thought this might be a simple project to start with?

  2. #2
    Join Date
    Jul 2010
    I have managed to achieve the same result using a simple php include

    However can somebody please tell me if this is possible in javascript and why my document was wrong, does it need something to tell it to get a url in the file? cheers

  3. #3
    Join Date
    Mar 2006
    About the easiest way is to use a server side include. Then you have just one copy of the menu (in a separate file) and you use an include statement to pull it into each page.

    That has to be enabled on the server, though.

  4. #4
    Join Date
    Mar 2010
    If you want to do it in javascript, you could do something like this:

    1) put all the html code that displays your menu into a javascript string variable within a javascript function named something like displayMenu()

    2) the last line of that function could then be document.write(str);

    3) put the function in an external javascript file.

    4) on each page where you need the menu, call the external javascript file using the src attribute of <script> within your <head>

    5) then wherever you need the menu displayed in your html, call the javascript function you created in 1).

    Whenever you need to edit your menu, you only need to do it in 1 place - the function in your external js file.

    But if you have access to server side scripting like php, then imo using include files is a better option.

  5. #5
    Join Date
    Mar 2006
    I'm no access nazi. I think folks should decide what they want to do and who they want to cater to. PHP or SSI is a much better option than javascript. People turn off javascript, but I don't think they can turn off SSI, and frankly, if you turn off javascript you get less on the net period.

    Go that way dude. It's a better solution in virtually every way you can think about, IF you can do it. Most likely, you can. Don't remember the last time I could not use includes. Three years ago I think only because where I work we are still debating html 1.

  6. #6
    Join Date
    Mar 2010
    yep, ageee in general - but I have had clients who only want static websites for their purposes and hence don't want to pay unnecessary extra hosting charges for server side scripting options to be enabled on their acoounts.

  7. #7
    Join Date
    Mar 2006


    Quote Originally Posted by tirna View Post
    yep, ageee in general - but I have had clients who only want static websites for their purposes and hence don't want to pay unnecessary extra hosting charges for server side scripting options to be enabled on their acoounts.
    I think as developers we all work within constraints. Yours are 'client' centered, and mine are 'organization' centered.

    We only have to be honest on these boards, try to help and be respectful if folks correct our errors (I'm speaking of my errors) and interject some slight editorial comments because as developers we have to work within the parameters of the craft. Plus, whoever is in charge inevitably doesn't know what they are talking about, be it client or boss.

    After that, hit a beer or two and be respectful of all folks as we hope they are with us.

  8. #8
    Join Date
    Jul 2010
    Hey everyone, I have server side so I used php includes which I agree is much easier, I just asked secondly about the javascript for curiosity as I'd really like to start learning Js. The breakdown you gave was great for understanding the dif elements I'd need, thanks!

  9. #9
    Join Date
    Nov 2002
    Baltimore, Maryland
    Except, 1) You should not use document.write. It's been pretty much depricated and is not supposed to work with XHTML. And 2) JavaScript is way iffy and should not be used for anything important like navigation. If you must, however and this is only for the academic discussion, then build the menu with DOM methods and use the NOSCRIPT element or other means to provide a link to a separate HTML page that provides the links.
    “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
    —Tim Berners-Lee, W3C Director and inventor of the World Wide Web

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



X vBulletin 4.2.2 Debug Information

  • Page Generation 0.10743 seconds
  • Memory Usage 2,925KB
  • Queries Executed 15 (?)
More Information
Template Usage (33):
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_global_above_footer
  • (1)ad_global_below_navbar
  • (1)ad_global_header1
  • (1)ad_global_header2
  • (1)ad_navbar_below
  • (1)ad_showthread_firstpost_sig
  • (1)ad_showthread_firstpost_start
  • (1)ad_thread_first_post_content
  • (1)ad_thread_last_post_content
  • (1)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (9)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (9)postbit
  • (9)postbit_onlinestatus
  • (9)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available (6):
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files (26):
  • ./showthread.php
  • ./global.php
  • ./includes/class_bootstrap.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/functions_navigation.php
  • ./includes/class_friendly_url.php
  • ./includes/class_hook.php
  • ./includes/class_bootstrap_framework.php
  • ./vb/vb.php
  • ./vb/phrase.php
  • ./includes/functions_facebook.php
  • ./includes/functions_calendar.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_notice.php
  • ./packages/vbattach/attach.php
  • ./vb/types.php
  • ./vb/cache.php
  • ./vb/cache/db.php
  • ./vb/cache/observer/db.php
  • ./vb/cache/observer.php 

Hooks Called (70):
  • init_startup
  • friendlyurl_resolve_class
  • init_startup_session_setup_start
  • database_pre_fetch_array
  • database_post_fetch_array
  • init_startup_session_setup_complete
  • global_bootstrap_init_start
  • global_bootstrap_init_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • load_show_variables
  • load_forum_show_variables
  • global_state_check
  • global_bootstrap_complete
  • global_start
  • style_fetch
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • strip_bbcode
  • friendlyurl_clean_fragment
  • friendlyurl_geturl
  • forumjump
  • cache_templates
  • cache_templates_process
  • template_register_var
  • template_render_output
  • fetch_template_start
  • fetch_template_complete
  • parse_templates
  • fetch_musername
  • notices_check_start
  • notices_noticebit
  • process_templates_complete
  • friendlyurl_redirect_canonical
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • memberaction_dropdown
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • build_navigation_data
  • build_navigation_array
  • check_navigation_permission
  • process_navigation_links_start
  • process_navigation_links_complete
  • set_navigation_menu_element
  • build_navigation_menudata
  • build_navigation_listdata
  • build_navigation_list
  • set_navigation_tab_main
  • set_navigation_tab_fallback
  • navigation_tab_complete
  • fb_like_button
  • showthread_complete
  • page_templates