Unwanted blank elements

[Claus Mygind]

When I examine the arrays I have created, I see these extra commas (blank elements) inserted before each entry. They are blank elements, but I do not know why the code generates them (see code snippet).

I loop through the options array of the select element in my function and only add elements to the array if they have been selected. So what is happening?

,,,,,,,,,,,,,,, 15. Layout,,,,,,,,, ,,,,,,,,,,,,,,, ,40. Enviromental,,, ,,,,,,,,,,,,,,, ,,,,,,,,,,,,70. Concrete and Asphalt Lab.
15
"15. Layout"
40
"40. Enviromental"
70
"70. Concrete and Asphalt Lab."

   		<select
			id  ="PHASECODE"
			name="PHASECODE"
			class="InputText"
			disabled="disabled"
			multiple="multiple"
			size="10"
		>
			<option value="10">10. Drilling</option>
			<option value="15">15. Layout</option>
			<option value="30">30. Geotechnical Eng.</option>
			<option value="40">40. Enviromental</option>
			<option value="50">50. Design Services</option>
			<option value="60">60. Construction Material Eng.</option>
			<option value="70">70. Concrete and Asphalt Lab.</option>
			<option value="80">80. Soils Lab.</option>
			<option value="92">92. Maint. Shop Activites</option>
		</select>
		<input
			type="button" 
			id="bAddPhaseCodes" 
			value="Add more Depts. to this template" 
			onclick="addPhase(this);"
		>

function addPhase(obj)
{
  cGroupName = document.getElementById("GROUPNAME").value;
  cDept = document.getElementById("JDEPTID").value;
  for (var i = 0; i < document.getElementById("PHASECODE").options.length; i++ )
  {
    if ( document.getElementById("PHASECODE").options[i].selected )
    {
     aPhaseCodes[document.getElementById("PHASECODE").options[i].value] = document.getElementById("PHASECODE").options[i].text; 
   }
  }

	//add phase codes to department array
	aDept[cDept] = aPhaseCodes

	//add department array to group name (template) array
	aTemplates[cGroupName] = aDept;
alert(aPhaseCodes.length);
}

[acoder]

You're using the value as an index. When you set the index greater than the length of the array, the array automatically increases the size and fills the indices in between with blanks or undefined.

[Claus Mygind]

Thank you very much.

My workaround to using the number as a label in the array was to add a blank after the value. Will that cause me problems when examining the array?

		
if ( document.getElementById("PHASECODE").options[i].selected )
{
  cWk = document.getElementById("PHASECODE").options[i].value+' ';
  aPhaseCodes[cWk] = document.getElementById("PHASECODE").options[i].text; 
}

[acoder]

It can because it's using object syntax, but you could just use a for..in loop. One other option is to use an object {}.