I am new to javascript, I have created 2 functions, createInput() which creates input boxes with a name parameter when called and appends them to a tag, newTwo() which calls createInput() twice with two different names.
I cannot seem to provide a index for the two name elements and make it increment each time the newTwo() is called. I need this so that I can trace the field values as a pair.
function createInput(name)
{
var input = document.createElement("input");
input.setAttribute("type", "text");
input.setAttribute("name", name);
var form = document.getElementById("foobar");
form.appendChild(input);
}
function newTwo()
{
var $i = 0;
createInput("first_name[" + $i + "]");
createInput("last_name[" + $i + "]");
$i++;
}
When I call newTwo(), input fields are created with the array index as follows.
<input type="text" name="first_name[0]" />
<input type="text" name="last_name[0]" />
If I call it again, the next two fields will be
<input type="text" name="first_name[0]" />
<input type="text" name="last_name[0]" />
my desired output for the previous second call would be
<input type="text" name="first_name[1]" />
<input type="text" name="last_name[1]" />
Any suggestions? Thanks in advance.