Wrox Programmer Forums
Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript How-To
Javascript How-To Ask your "How do I do this with Javascript?" questions here.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript How-To section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
Old September 19th, 2004, 08:48 AM
Registered User
Join Date: Sep 2004
Posts: 9
Thanks: 0
Thanked 0 Times in 0 Posts
Default Menu / Dropdown List Selection Reduction

Hello all ,I have nearly finished client-side validation for an online form. I have actually got it to work. However , I still have one problem to solve.

The form contains a set of menu / dropdown lists from which the user selects an option from each menu. The set of menu / dropdown lists contain the same list of options. I want the form to dynamically remove the option selected in the first menu from all of the subsequent menus. The same for the second and so forth until there is only one option remaining in the final menu within the set.

Does anybody have any suggestions ?

Thanks for taking the time to resd this and for any suggestions offered,

Old September 20th, 2004, 02:06 AM
Friend of Wrox
Join Date: Jun 2004
Posts: 449
Thanks: 0
Thanked 1 Time in 1 Post
Send a message via MSN to r_ganesh76

can you give some idea on how you have implemented these menus so that your idea becomes more clear

Old September 20th, 2004, 03:43 AM
Friend of Wrox
Join Date: Jul 2003
Posts: 683
Thanks: 0
Thanked 1 Time in 1 Post

Hi Larry,

I think this should get you started...



<script type="text/javascript">
function Init(){
    // populate the boxes & wire up onchange handler
    var f = document.forms[0];
    for(var i = 1; i <= 5; i++){
        var select = f["Select" + i];
        select.options.add(new Option());
        for(var j = 1; j <= 5; j++){
            select.options.add(new Option("Option " + j, j));
        f["Select" + i].onchange = new Function("RestrictOptions(this);");
function RestrictOptions(pSelect){
    // work out which select was changed & update those lower down the chain
    var selectedValue = pSelect[pSelect.selectedIndex].value;
    var selectNum = parseInt(pSelect.id.replace(/\D/g, ""), 10);
    var f = document.forms[0];
    for(var i = selectNum + 1; i <=5; i++){
        var select = f["Select" + i];
        for(var j = 0; j < select.options.length; j++){
            if(select.options[j].value == selectedValue){
    pSelect.disabled = true;


<body onload="Init();">

<form id="myForm">
    <select id="Select1"></select>
    <select id="Select2"></select>
    <select id="Select3"></select>
    <select id="Select4"></select>
    <select id="Select5"></select>



Similar Threads
Thread Thread Starter Forum Replies Last Post
Need Multiple selection DropDown surendran ASP.NET 2.0 Basics 1 September 26th, 2008 07:49 AM
DropDown Value Selection problem....... dharmeshtandel ASP.NET 2.0 Basics 0 May 15th, 2008 07:27 AM
Multi selection dropdown control ninel ASP.NET 1.0 and 1.1 Basics 1 March 8th, 2007 12:56 PM
fill dropdown list with items when parent list isaac_cm Pro PHP 1 July 10th, 2006 05:41 AM
The problem with pop-up menu and dropdown list williamwang ASP.NET 1.0 and 1.1 Basics 1 April 14th, 2004 02:33 PM

Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.