My JS breaks when I use name="foo[]"!
[ and ] are meaningful characters in JS. Thusly, if you try to use formRef.fieldName[].value, you will get an error.
Every object can have its properties accessed either via obj.propName or obj["propName"]. Use the latter to form the name from a variable obj[variableWithPropName], obj["el"+i] or if the name is not a valid identifier, obj["%stupid name[]"].
Thus for a form, use <form id="myForm" ... and document.getElementById("myForm").elements["fieldName"].value.
If there are multiple instances of the named element, then you can use this method.
HTML:
<input type="text" value="one" name="test[]"/>
<input type="text" value="two" name="test[]"/>
<input type="text" value="three" name="test[]"/>
<input type="text" value="four" name="test[]"/>
<input type="text" value="five" name="test[]"/>
Script:
var namedElements = document.getElementsByName("test[]");
for (var elIdx=0;elIdx<namedElements.length;elIdx++){
alert(namedElements[elIdx].value);
}
The getElementsByName method returns a collection. In the code above I am simply looping through them to alert out the value.
It should be noted, though, that getElementsByName must be called from the document level, it is not available at the element level. This means that if you have two forms on the page and they both have separate collections of identically named form elements, all of them will be returned.