Accessing form array with javascript

[mightymouse3062]

Good Morning,
I am working creating a form and checking it with Javascript. I coded part of it to have the fields be an array, in which I am now having trouble trying to access the values of it. What am I doing wrong?

Here is the part of the form, called staffApplication, where I have the array defined:

              <tr>
                <td align="left">
                  <input type="text" name="positionDesired[1]" size="45" value="1st Choice" onblur="if(this.value=='') this.value='1st Choice';" onfocus="if(this.value=='1st Choice') this.value='';">
                </td>
                <td align="right">
                  <input type="text" name="positionDesired[2]" size="45" value="2nd Choice" onblur="if(this.value=='') this.value='2nd Choice';" onfocus="if(this.value=='2nd Choice') this.value='';">
                </td>
              </tr>
              <tr>
                <td align="left">
                  <input type="text" name="positionDesired[3]" size="45" value="3rd Choice" onblur="if(this.value=='') this.value='3rd Choice';" onfocus="if(this.value=='3rd Choice') this.value='';">
                </td>
                <td align="right">
                  <input type="text" name="positionDesired[4]" size="45" value="4th Choice" onblur="if(this.value=='') this.value='4th Choice';" onfocus="if(this.value=='4th Choice') this.value='';">
                </td>
              </tr>

Here is the part of the Javascript code that is checking these fields:

var form = document.staffApplication;
if(form.positionDesired[1].value == "" || form.positionDesired[1].value == "1st Choice"){
alert("Please enter your first choice for a position");
return false;
} else if(form.positionDesired[2].value == "" || form.positionDesired[2].value == "2nd Choice"){
alert("Please enter your second choice for a position");
return false;
} else if(form.positionDesired[3].value == "" || form.positionDesired[3].value == "3rd Choice"){
alert("Please enter your third choice for a position");
return false;
} else if(form.positionDesired[4].value == "" || form.positionDesired[4].value == "4th Choice"){
alert("Please enter your forth choice for a position");
return false;
}

Thanks,
Mike

[Fotiman]

positionDesired is not an array in the form, despite that you've named it similar to an array (using []). When your form is submitted, you will be sending something like this to the server:

?positionDesired[1]=&positionDesired[2]=&positionDesired[3]=&positionDesired[4]=

In other words, you have 4 distinct fields, vs. an array.

To access this with JavaScript, you'll need to use the array notation on the form instead of the dot notation. The array notation allows access to named fields that contain characters that might not be interpreted correctly using dot notation. So here's what you might do:

if (form["positionDesired[1]"].value == "" ...

Hope that helps.

[mightymouse3062]

Thats exactly what I was looking for.


Thanks for your assistance.

~Mike