Jump to content


Photo

Multiple select boxes


  • Please log in to reply
1 reply to this topic

#1 ldsmike88

ldsmike88
  • Members
  • PipPipPip
  • Advanced Member
  • 168 posts
  • LocationFlorida

Posted 08 March 2006 - 04:21 AM

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:
<!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>

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

#2 ldsmike88

ldsmike88
  • Members
  • PipPipPip
  • Advanced Member
  • 168 posts
  • LocationFlorida

Posted 08 March 2006 - 06:49 PM

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




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users