Jump to content

Archived

This topic is now archived and is closed to further replies.

ldsmike88

Multiple select boxes

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

Share this post


Link to post
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

Share this post


Link to post
Share on other sites

×

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.