Add a zero to a set of values

JavaScript
1

Hello everyone! What a marvelous day!

I have a piece of script that pre-fills some drop down menus based on the selection of another drop down menu


<script type="text/javascript">
/*<![CDATA[*/

var FillArray=[];
FillArray[1]=[4,[B]2,2[/B]];
FillArray[2]=[4,[B]2,2[/B]];
FillArray[3]=[4,[B]2,2[/B]];
FillArray[4]=[4,[B]3,3[/B]];
FillArray[5]=[5,[B]5,5[/B]];
FillArray[6]=[5,[B]5,5[/B]];
FillArray[7]=[8,[B]8,8[/B]];

function Fill(){
 var ary=FillArray[document.getElementById('pk1vehicle').value],selary=['pk1pax','pk1case','pk1carry'],sel,z0=0,z1a;
 for (;z0<selary.length;z0++){
  sel=document.getElementById(selary[z0]);
  sel.options.length=0;
  if (ary&&ary[z0]){
   for (z1a=0;z1a<ary[z0];z1a++){
    sel.options[z1a]=new Option(z1a+1,z1a+1);
   }
   sel.selectedIndex=0;
  }
 }
}
/*]]>*/
</script>

So basically if option 1 on the array is chosen:

FillArray[1]=[4,2,2];

3 drop downs are pre-filled with the values:
1,2,3,4
1,2
1,2

My problem is… for the 2nd and 3rd drop downs, I would like those to include 0 as an option…

Therefore I would want this…

FillArray[1]=[4,2,2];

to produce this:

1,2,3,4
0,1,2
0,1,2

I do not want the 0 to appear in the first drop down…

Can somebody please assist me?

2

The following script will give you the zeros you’re looking for. It checks to see if it is looping in the 2nd and 3rd select elements and puts an initial zero value before the first option. Using [sel.options.length] keeps the options in the correct order, rather than using a counter. :slight_smile:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Add zero to array</title>
<style type="text/css">
 body { font-family:arial, helvetica, sans-serif; font-weight:normal; font-size:13px; color:#000; text-align:left; margin:3px 0px; }
 #wrap { width:500px; height:500px; margin:20px;  }
 select { width:50px; float:left; margin-right:20px; }
</style>
</head>

<body>

<div id="wrap">
  <select id="pk1vehicle" onchange="Fill()" name="pk1v">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</option>
  </select>
  <div>
    <select id="pk1pax" name="pk1pax"></select>
  </div>
  <div>
    <select id="pk1case" name="pk1case"></select>
  </div>
  <div>
    <select id="pk1carry" name="pk1carry"></select>
  </div>
</div>
<script type="text/javascript">
  var FillArray=[];
  FillArray[0]=[]; FillArray[1]=[4,2,3]; FillArray[2]=[4,3,4];
  FillArray[3]=[4,4,5]; FillArray[4]=[4,3,4]; FillArray[5]=[5,4,2];
  FillArray[6]=[5,2,4]; FillArray[7]=[8,8,8]; FillArray[8]=[8,8,8];
// ------
function Fill(){ 
  var ary=FillArray[document.getElementById('pk1vehicle').value];
  var salary=['pk1pax','pk1case','pk1carry'];
  var sel, z=0, z1a;
  
  for (z=0; z<salary.length; z++)
    { sel=document.getElementById(salary[z]);
      sel.options.length=0;
      if (ary&&ary[z])
       { for(z1a=0;z1a<ary[z];z1a++)
           { if(z>0 && z1a==0){ sel.options[sel.options.length]=new Option("0","0"); }          
             sel.options[sel.options.length]=new Option(z1a+1, z1a+1); 
           } 
            sel.selectedIndex=0;
        } } }
// ------  
  </script>

</body>

</html>
3

Excellent work. Thank you very much.