[SOLVED] changing combo box options

cha0sriderx · November 23, 2007

im working on a parts list for a game i play online, im trying to get it to load the parts based on town and car. im kinda new to javascript so i dont really know all the things you can do or cannot do. i got the "template" on how to change combo box's from a website.

also inorder for me to use like cars["1"]["2"](would be cars["1"]["2"]["0"] is the scanning part) as the object do i need to make a new object or just add on the extra []

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript">
var cars = new Object()

cars["1"] = [{value:"1", town:"1", text:"Parts - Town 1"},
             {value:"2", town:"2", text:"Parts - Town 2"},
             {value:"3", town:"3", text:"Parts - Town 3"},
             {value:"4", town:"4", text:"Parts - Town 3"}];

function update() {
  car = document.setups.car.value;
  town = document.setups.town.value;

  if (town > 0 && town < 5) {
    parts(car,town); 
  }
}

function parts(dcar,dtown) {
    var part = document.form.elements["test"];
    part.options.length = 0;

    var db = cars[dcar];

    for (var i = 0; i < db.length; i++) {
      if (db[i].town <= dtown) {
        part.options[i + 1] = new Option(db[i].text, db[i].value, false);
      }
    }
}
</script>
</head>

<body>
<form name="setups">
<select name="town" onchange="update()">
    <option value="" selected></option>
    <option value="1">toreno</option>
    <option value="2">newburge</option>
    <option value="3">creek side</option>
    <option value="4">vista</option>
    <option value="5">stock</option>
</select>
<select name="car">
    <option value="1">Acura Integra GS-R</option>
</select>
<select name="test">
    <option value="0">------</option>
</select>
</form>
</body>
</html>

cha0sriderx · November 23, 2007

okay i got the code part working but id like to make it so it reads cars[car][part number] instead just cars[car].

what i want

/* car 1 - part number 1*/
cars["1"]["1"] = [{town:"1", text:"1 Part 1 - 1"},
                       {town:"2", text:"1 Part 1 - 2"},
                       {town:"3", text:"1 Part 1 - 3"},
                       {town:"4", text:"1 Part 1 - 4"}];
/* car 1 - part number 2*/
cars["1"]["2"] = [{town:"1", text:"1 Part 2 - 1"},
                       {town:"2", text:"1 Part 2 - 2"},
                       {town:"3", text:"1 Part 2 - 3"},
                       {town:"4", text:"1 Part 2 - 4"}];

working code with what i have for cars[""].

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head>
<script type="text/javascript">
var cars = new Object()
cars["1"] = [{town:"1", text:"1 Part - 1"},
                  {town:"2", text:"1 Part - 2"},
                  {town:"3", text:"1 Part - 3"},
                  {town:"4", text:"1 Part - 4"}];

cars["2"] = [{town:"1", text:"2 Part - 1"},
                  {town:"2", text:"2 Part - 2"},
                  {town:"3", text:"2 Part - 3"},
                  {town:"4", text:"2 Part - 4"}];


function parts() {
  var town = document.setups.elements["0"].value;
  var car = document.setups.elements["1"].value;
  var part = document.setups.elements["2"];
  if (car != "" && town != "" && town != "5") {
    part.options.length = 0;
    var db = cars[car];
    part.options[0] = new Option("Choose a Part:", "", true, false);
    for (var i = 0; i <= db.length; i++) {
      x = i + 1;
      if (db[i].town <= town) {
        part.options[x] = new Option(db[i].text, x);
      }
    }
  }
}

</script>
</head>

<body>
<form name="setups">

<select name="town" onchange="parts()">
    <option value="" selected>Select A Town:</option>
    <option value="1">toreno</option>
    <option value="2">newburge</option>
    <option value="3">creek side</option>
    <option value="4">vista</option>
    <option value="5">stock</option>
</select>

<select name="car" onchange="parts()">
    <option value="" selected>Select A Car:</option>
    <option value="1">car 1</option>
    <option value="2">car 2</option>
</select>
<select name="1">
    <option value="" selected> </option>
</select>
</form>
</body>
</html>

cha0sriderx · November 24, 2007

for some reason it wont let me edit my post again so ill just add it here. i got the array to work the way i wanted too but for some reason my nested for loop is only doing the first number.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head>
<script type="text/javascript">
var cars =new Array()
cars[0] =""
cars[1] =new Object()
cars[2] =new Object()

cars["1"]["1"] = [{town:"1", text:"car 1 Part 1 - 1"},
                        {town:"2", text:"car 1 Part 1 - 2"},
                        {town:"3", text:"car 1 Part 1 - 3"},
                        {town:"4", text:"car 1 Part 1 - 4"}];

cars["1"]["2"] = [{town:"1", text:"car 1 Part 2 - 1"},
                         {town:"2", text:"car 1 Part 2 - 2"},
                         {town:"3", text:"car 1 Part 2 - 3"},
                         {town:"4", text:"car 1 Part 2 - 4"}];

cars["2"]["1"] = [{town:"1", text:"car 2 Part 1 - 1"},
                         {town:"2", text:"car 2 Part 1 - 2"},
                         {town:"3", text:"car 2 Part 1 - 3"},
                         {town:"4", text:"car 2 Part 1 - 4"}];

cars["2"]["2"] = [{town:"1", text:"car 2 Part 2 - 1"},
                         {town:"2", text:"car 2 Part 2 - 2"},
                         {town:"3", text:"car 2 Part 2 - 3"},
                         {town:"4", text:"car 2 Part 2 - 4"}];

function parts() {
  var town = document.setups.town.value;
  var car = document.setups.car.value;
  var p;
  var i;
  if (car != "" && town != "" && town != "5") {
    for (p=1;p<=2;p++) {
      alert(p);
      part = document.getElementById(p);
      part.options.length = 0;
      part.options[0] = new Option("Choose a Part:", "", true, false);
      db = cars[car][p];
      for (i=0;i<=db.length;i++) {
        x = i + 1;
        if (db[i].town <= town) {
          part.options[x] = new Option(db[i].text, x);
        }
      }
    }
  }
  if (town == "5") {

  }
}

</script>
</head>

<body>
<form name="setups">

<select name="town" onchange="parts()">
    <option value="" selected>Select A Town:</option>
    <option value="1">toreno</option>
    <option value="2">newburge</option>
    <option value="3">creek side</option>
    <option value="4">vista</option>
    <option value="5">stock</option>
</select><br /><br />

<select name="car" onchange="parts()">
    <option value="" selected>Select A Car:</option>
    <option value="1">car 1</option>
    <option value="2">car 2</option>
</select><br /><br />

<select name="1" id="1">
    <option value="" selected> </option>
</select><br /><br />

<select name="2" id="2">
    <option value="" selected> </option>
</select>
</form>
</body>
</html>

Sign In

[SOLVED] changing combo box options

Recommended Posts

cha0sriderx

Link to comment

Share on other sites

cha0sriderx

Link to comment

Share on other sites

cha0sriderx

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information