Hi guys,

I have a form with many text fields that are created from another program (java)
<input type=text name = 'myname1'>
<input type=text name = 'myname2'>
<input type=text name = 'myname3'>
.
.
.
.
.

and I have a javascript that loops through these text fields

for (var x = 1; x <= numberoftextfields; x++)
{
document.FormName.myname+x+.value = 'Test';

}

This javascript does not work.
Can somebody assist me on this.

Thanks in advance

What script error do you receive? Try placing the myname variable names in another variable before setting the value.

Use ID property from html element to call from javascript

<input type=text name = 'myname1' id='myname1'>
<input type=text name = 'myname2' id='myname2'>
<input type=text name = 'myname3' id='myname3'>
window.onload = function() {
  for (var i = 1; i < 4; i++) {
    document.getElementById('myname' + i).value = 'hi from for number ' + i;
  };
}

Or something like this. Works in IE, FF and Opera.

<html>
<head>
    <script type='text/javascript'>
    var CONST = 'myname';
    function doSomething(frm)
    {
        for(var i = 1; i < 4; ++i)
        {
            var txt = CONST + i;
            document.frm[txt].value = 'Test';
        }
    }
    </script>
</head>
<body>
    <form name="frm">
        <input type = 'text' name = 'myname1' /><br />
        <input type = 'text' name = 'myname2' /><br />
        <input type = 'text' name = 'myname3' /><br />
        <input type = 'button' onclick = 'doSomething(this.form);' value = 'Do' />
    </form>
</body>
</html>

Hi guys,
document.FormName.myname+x+.value = 'Test';

The reason your code didn't work is that you were trying to construct the element variable as if it were a string... If you wanted to to it like this, you would need to construct the javascript you wanted to execute as a string and then execute it in an eval function...

i.e.

var strCommand = "document.FormName.myname" + x + ".value = 'Test';";
eval(strCommand);

However the other solutions recommended are better practice.

I was off sick yesterday and I got to use your suggestions and they work perfect.
Thank you very much.

document.FormName.myname+x+.value = 'Test';

replace with

if (document.getElementById('myname' + x)) {
   document.getElementById('myname' + x).value = 'Test';
}

HMM WHY DID I NOT SEE EVERYONES POSTS 2 MINS AGO ?
DANIWEB THREW A BRAIN FART OR I AM A LEPER

I'm surprised no-one thought of:

var textBoxArray = document.getElementsByTagName("input");

for(var i = 0; i < textBoxArray.length; ++i)
{
    if(textBoxArray[i].type == "text")
    {
        textBoxArray[i].value = "test";
    }
}

All previous solutions rely on:
a. Knowing how many inputs there are.
b. Knowing the naming convention.

Shoot me down if you like but to me they are code smells.

The previous ones are perfect because I have other input textboxes with names like myusname, mypassword, and so on.
So I only wanted textboxes with myname1, myneme2.......

These textboxes are created from an xml file

<person>
<myusername>....</myusername>
<mypassword>....</mypassword>
<myname1>....</myname1>
<myname2>....</myname2>
<myname3>....</myname3>
.
.
.
.
.
</person>

Then that is best passed as a parameter IMO.

Just offering a more loosley coupled solution for the benefit of the thread that's all.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <script type="text/javascript">
        function setText(txtID, txtValue)
        {
            var textBoxArray = document.getElementsByTagName("input");

            for(var i = 0; i < textBoxArray.length; ++i)
            {
                if(textBoxArray[i].type == "text" && textBoxArray[i].id.substring(0, txtID.length) == txtID)
                {
                    textBoxArray[i].value = txtValue;
                }
            }
        }
    </script>
</head>
<body>
        <input type="text" id="myname1" /><br />
        <input type="text" id="myname2" /><br />
        <input type="text" id="myname3" /><br />
        <input type="button" onclick="setText('myname', 'test');" value = 'Go' />
</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.