homepage Welcome to WebmasterWorld Guest from 54.196.159.11
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
JavaScript SelectBox
Basic HTML select box created in External JS file
wfernley




msg:3541060
 2:46 pm on Jan 5, 2008 (gmt 0)

Hey everyone,

I need to create a basic HTML select box that will contain all my products. This select box will then be displayed on all my pages and allow visitors to quickly select a product in the select box and it will then forward them to the correct page.

Considering I have thousands of products, I was hoping to make this select box in an external JS file so search engines don't have to read through all the code.

Is it possible to call in an external JS file that creates this select box? This will mean it only takes up one line of code on the page and a search engine doesn't have to read through all the select box' code.

Thanks in advance for your help!

Wes

 

Birdman




msg:3541084
 3:35 pm on Jan 5, 2008 (gmt 0)

Hello,

This should do what you need. It simply uses the innerHTML object and dynamically writes the <option>s into the <select>:

The External JS:

window.onload = loadProducts;

function loadProducts() {
mySelect = document.getElementById('myProducts');
mySelect.innerHTML = '<option value="http://google.com">Google</option>';
mySelect.innerHTML += '<option value="http://yahoo.com">Yahoo!</option>';
}

Head of HTML Page:

<script type="text/javascript" src="path/to/js.js"></script>

Body of HTML Page:

<select id="myProducts" onchange="window.location.href=this.value"></select>

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved