Jump to content

Multiple select boxes


ldsmike88

Recommended Posts

I hate it when people post their whole code and want an answer to all their problems... but I don't know what is wrong with it so here it is:[code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript" >
//////////////////////////////////////////////////
//                    Model                        //
//////////////////////////////////////////////////
function addModel(text, selectValue){
    var form = window.document.makeModelYearForm;
    var optn = document.createElement("OPTION");
    optn.text = text;
    optn.value = selectValue;
    form.Model.options.add(optn);
    if(selectValue == "none"){
        form.Model.disabled=true;
        form.Search.disabled=true;
    } else {
        form.Model.disabled=false;
    }
    form.Year.disabled=true;
    form.Search.disabled=true;
}

function addOption_list(make){
    if(make == 'none'){var model = new Array("none");}
    if(make == 'Audi'){var model = new Array("A6");}
    if(make == 'Buick'){var model = new Array("Century", "Lacrosse", "Lesabre", "Lucerne", "Park Avenue");}
    if(make == 'Cadillac'){var model = new Array("Escalade");}
    if(make == 'Chrysler'){var model = new Array("300","300C","PT Cruiser");}
    for (var i=0; i < model.length;++i){
        addModel(model[i], model[i]);
    }
}
function removeAllOptions(){
    var i;
    for(i=window.document.makeModelYearForm.Model.options.length-1;i>=0;i--){
        window.document.makeModelYearForm.Model.remove(i);
    }
    var optn = document.createElement("OPTION");
    optn.text = "Select a model";
    optn.value = "none";
    window.document.makeModelYearForm.Model.options.add(optn);
}
//////////////////////////////////////////////////
//                    Year                        //
//////////////////////////////////////////////////
function addYear(text, selectValue){
    var form = window.document.makeModelYearForm;
    var optn = document.createElement("OPTION");
    optn.text = text;
    optn.value = selectValue;
    form.Year.options.add(optn);
    if(selectValue == "none"){
        form.Year.disabled=true;
        form.Search.disabled=true;
    } else {
        form.Year.disabled=false;
    }
}

function addYearList(model){
    if(model == 'none'){var year = new Array("none");}
//Audi    
    if(model == 'A6'){var year = new Array("2005", "2006");}
//Buick
    if(model == 'Century'){var year = new Array("1997", "1998", "1999", "2000", "2001", "2002", "2003", "2004");}
    if(model == 'Lacrosse'){var year = new Array("2005", "2006");}
    if(model == 'Lesabre'){var year = new Array("2000", "2001", "2002", "2003", "2004", "2005");}
    if(model == 'Lucerne'){var year = new Array("2006");}
    if(model == 'Park Avenue'){var year = new Array("1997", "1998", "1999", "2000", "2001", "2002", "2003", "2004", "2005");}
//Cadillac
    if(model == 'Escalade'){var year = new Array("2005");}
//Chrysler
    if(model == '300'){var year = new Array("2005", "2006");}
    if(model == '300C'){var year = new Array("2005", "2006");}
    if(model == 'PT Cruiser'){var year = new Array("2006");}
    for (var i=0; i < year.length;++i){
        addYear(year[i], year[i]);
    }
}
function removeAllYearOptions(){
    var i;
    for(i=window.document.makeModelYearForm.Year.options.length-1;i>=0;i--){
        window.document.makeModelYearForm.Year.remove(i);
    }
    var optn = document.createElement("OPTION");
    optn.text = "Select a year";
    optn.value = "none"
    window.document.makeModelYearForm.Year.options.add(optn);
}
//////////////////////////////////////////////////
//                    Button                        //
//////////////////////////////////////////////////
function showButton(value){
    if(value == "none"){
        window.document.makeModelYearForm.Search.disabled=true;
    } else {
        window.document.makeModelYearForm.Search.disabled=false;
    }
}
</script>
</head>

<body>
<form name="makeModelYearForm" action="list.php" method="post" >

<SELECT id="form" name="make" onChange="removeAllOptions();removeAllYearOptions();addOption_list(this.value);">
    <OPTION value="none" selected>Select a make</OPTION>
    <OPTION value="Audi">Audi</OPTION>
    <OPTION value="Buick">Buick</OPTION>
    <OPTION value="Cadillac">Cadillac</OPTION>
    <OPTION value="Chrysler">Chrysler</OPTION>
</SELECT>

<SELECT name="Model" disabled="disabled" onchange="removeAllYearOptions();addYearList(this.value);">
    <Option value="none" selected>Select a model</option>
</SELECT>
<SELECT name="Year" disabled="disabled" onchange="showButton(this.value)">
    <Option value="none" selected>Select a year</option>
</SELECT>
<INPUT type="submit" class="button" value="Search" name="Search" disabled="disabled">
</form>

</body>
</html>[/code]

Everything works fine, but when I click on submit and go to the next page, the only variable sent from the form is the make... no model and no year. Why arn't the others being send? Thanks!

Mike
Link to comment
Share on other sites

Well that was stupid... I already had this script working but in a little different way. My list.php was looking for the variables model and year not Model and Year... so I just changed them to lower case in my javascript and select boxes and it all works great now.

Mike
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.