Business Sites     

 Web Applications      Web Site Hosting      Search Engine     
CompanyWeb.net: Web Hosting, Internet Programming, Search Engine Optimization

 

 


CompanyWeb Search



Web Design Master Series Article

Web Design Master Series Article is syndicated from Web-Source.net.

Syndicated articles are written by independent authors and the contents represent the author's views. The content of the article does not necessarily represent the views of Company Web staff and management.

Master Series

Changing Dropdown Content On-the-Fly (Without Reloading Web Page)

By William Bontrager

You've seen web pages with two dropdown lists where making a selection in one causes the web page to reload. Once reloaded, the list in the other dropdown has changed.

This article is about changing the contents of the second dropdown list — but without reloading the web page.

It's done with JavaScript.

Now that page reloads aren't necessary, the content of dropdown lists can be changed on-the-fly without annoying visitors and potential customers in that way.

The demonstration (link below) contains an example of a primary dropdown list changing the content of a secondary dropdown list. These two dropdowns are meant to be put into various types of forms, although they might also be used by themselves.

The dual dropdowns could be used as a site navigation aid. The primary dropdown could have the main sections of a web site as selections. When a selection is made, the secondary dropdown list content is changed to contain subsections. For example, "Books" might cause the secondary dropdown to contain a list of genres.

The technique might be used on an e-commerce site where sub-selections are necessary. For example, size 12 shirts might come in colors red and blue, and size 10 come in red, blue, yellow, and white. The size selection of the primary dropdown would change the color selections within the secondary dropdown.

When playing with the demonstration, you'll undoubtedly see potential for your web sites, maybe immediate applications. It's at http://willmaster.com/a/24t/pl.pl?art244

The above demonstration page has a download link for a ZIP file of code and instructions.

Now, you can have a dynamic dropdown list without annoying visitors with page reloads.

Will Bontrager

Copyright 2004 Bontrager Connection, LLC

About the Author:
William Bontrager Programmer/Publisher, "WillMaster Possibilities" ezine mailto:[email protected]

Are you looking for top quality scripts? Visit Willmaster and check out his highly acclaimed Master Series scripts. Some free, some for a fee.

Content Provided By:

More Master Series Articles...

 

Frontpage, NT are Trademarks of Microsoft Corporation. CompanyWeb Site Copyright (c) 1998 - 2003, CompanyWeb.net Site Development Service Group.