Question

I am dynamically creating inputs when the users double clicks an element in a select box. There can be multiple inputs per element type, so I am creating them as HTML arrays. When the inputs are created, a link is also created that points to a javascript function. Said function will open a calendar prompt for the specific field that was clicked. I have narrowed down the issue to the below code:

document.getElementById( 'start_' + field + '[]' ).length

As you see, I am trying to grab the length of the array just like I would with a normal javascript array. This, of course, is not working. I am unable to find anything on Google referencing this, which usually means it is impossible but I find that hard to believe.

Alternatively, I can increment a variable every time this field is created I just wanted to make sure I am not missing something painfully obvious.

Thank you in advance!

{EDIT}

Please reference http://www.thefutureoftheweb.com/blog/use-arrays-with-html-form-inputs before telling me that HTML does not allow arrays.

{DoubleEdit+Answer}

The issue was not that HTML arrays do not exist, but that the ID attribute cannot be an array. I found http://roshanbh.com.np/2008/08/handling-array-html-form-elements-javascript-php.html which explains how to do what I need…ish.

Answer 1

You can use the following pure JavaScript code:

oForm = document.forms[0];
oForm.elements['start_' + field + '[]'].length;

Or in jQuery library:

$('input[name="start_' + field + '[]"]').length;

I would prefer the second because I am not 100% sure about cross-browser compatibility of the first solution.