...

View Full Version : Changing Value of Form Object Using Partial ID



aanderson
03-19-2012, 11:26 PM
I want to have button2 populate form fields in a separate form with certain data I choose. The challenge is that the name of each text box is the same ("inputbox") and the id is dynamic, the first part only staying the same. So, the form element id would be "idb_4555557805340560...". There would only be one form element that begins with "idb."

The following code works, but doesn't address the dynamic id. How can I do this?


<HTML>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
function writeText (form) {
document.getElementById('ida').value = "Have a nice day!";
document.getElementById('idb').value = "Have a nice day!!";
document.getElementById('idc').value = "Have a nice day!!!";
}
</SCRIPT>

<form name="one"><INPUT TYPE="button" NAME="button2" Value="Write" onClick="writeText(document.myform)"></form>

<FORM NAME="myform" ACTION="" METHOD="GET">
<INPUT TYPE="text" NAME="inputbox" id="ida" VALUE="">
<INPUT TYPE="text" NAME="inputbox" id="idb" VALUE="">
<INPUT TYPE="text" NAME="inputbox" id="idc" VALUE="">
</FORM>
</BODY>
</HTML>

Old Pedant
03-19-2012, 11:53 PM
You want to write the *SAME* data to each <input> field?

That's easy:


<script type="text/javascript">
function writeText (form) {
var inputs = form.inputbox;
for ( var i = 0; i < inputs.length; ++i )
{
inputs[i].value = "Have a nice day!";
}
}
</script>


If it is possible that sometimes when you run this code there will only be ONE "inputbox", then you can do this:


<script type="text/javascript">
function writeText (form) {
var inputs = form.inputbox;
if ( inputs.length == null )
{
// convert the single element to an array of one element
inputs = [inputs];
}
for ( var i = 0; i < inputs.length; ++i )
{
inputs[i].value = "Have a nice day!";
}
}
</script>


NOTE: There is really no reason to use two <form>s here. An <input type="button"> will not be seen by any server-side code, so it won't interfere with the contents of your main <form> in any way.

NOTE: <SCRIPT Language=...> is long obsolete. Use the code showin, instead.

NOTE: Upper case HTML tags are only valid in old-style HTML pages. If you use a doctype of xhtml, which you likely should, they should all be lower case.

aanderson
03-19-2012, 11:58 PM
Whoops. Let me clarify. The value will always be the same for the input box with id beginning "ida_" but it will be a different value for the input box beginning with "idb_". For example, box A's value would always be 50, box B would be 25, etc. The reason for the separate forms is simply that I will not be able to modify the form that contains the input boxes. I'm going to have to work around that. :)

Thanks for taking a look!

Old Pedant
03-20-2012, 12:51 AM
Okay, not a big change:


<script type="text/javascript">
function writeText (form) {
var inputs = form.inputbox;
if ( inputs.length == null )
{
// convert the single element to an array of one element
inputs = [inputs];
}
for ( var i = 0; i < inputs.length; ++i )
{
input = inputs[i];
switch ( input.id.substring(0,4).toLowerCase() )
{
case "ida_":
input.value = "50";
break;
case "idb_":
input.value = "25";
break;
case "idc_":
input.value = "3.14159265";
break;
default:
input.value = "Unknown id for this field";
}
}
}
</script>

aanderson
03-20-2012, 08:53 PM
This is great! My only concern is sometimes the id will contain a number as well. For example, the id might be "i3b". Will I need to adjust this code since it converts to lower case?

Old Pedant
03-20-2012, 09:01 PM
No. the toLowerCase() function *only* converts upper case *LETTERS* to lower case. It doesn't affect characters that aren't letters. Actually, it isn't needed if you can guarantee that none of your id's will ever contain upper case letters and/or if you WANT to distinguish between upper and lower case. I admit I kind of threw it in there gratuitously.

And I also assumed that you would always have prefixes that are 3 characters followed by an underline. If that's not true--if sometimes you have shorter or longer prefixes--it's easy to change, so long as the underline always separates the prefix from the rest of the id. Thus (making a mildly silly example):



<script type="text/javascript">
function writeText (form) {
var inputs = form.inputbox;
if ( inputs.length == null )
{
// convert the single element to an array of one element
inputs = [inputs];
}
for ( var i = 0; i < inputs.length; ++i )
{
var input = inputs[i];
var prefix = input.id.split("_")[0];
switch ( prefix )
{
case "ida":
input.value = "50";
break;
case "idb":
input.value = "25";
break;
case "Rumplestiltskin":
input.value = "3.14159265";
break;
case "e":
input.value = "2.718281828";
break;
default:
input.value = "Unknown id for this field";
}
}
}
</script>

aanderson
03-21-2012, 08:57 PM
Thank you! This works exactly as it should now, and I've learned more from a good example than from an hour's research online. :thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum