Member Avatar for michael123

I have a form text field called "field_0", and javascript code:

<script language="javascript">
function test() {
var a=document.form1.field_0.value;
alert (a);
}
</script>
<form name=form1 ....>
<input type=text name=field_0>
<input type=text name=field_1>
<....onclick='javascript: test();'>
</form>

if I run this, it pops up correct message box with the "field_0" value.

However if I change a little in javascript code:

<script language="javascript">
function test() {
var fd="field_0";
var a=document.form1.fd.value;
alert (a);
}
</script>

this script will no longer work, how can I use variable "fd" in "document.form...."? any idea?

Thanks.

  • 3 Contributors
  • 4 Replies
  • 133 Views
  • 23 Hours Discussion Span
  • Latest Post Latest Post by ~s.o.s~

Dani AI

Generated

Short answer: dot notation reads a property literally (so obj.name looks for the property "name"), while bracket notation uses the string value in a variable. was right to point toward DOM lookup methods, and was right that you need bracket-style access — but use the form's elements collection or a standard selector rather than relying on legacy global shortcuts.

Example approaches (use different names than the originals shown above):

var key = 'myField';
var val = document.forms['theForm'].elements[key].value;

Or, using a modern selector (works in all current browsers):

var valById = document.querySelector('#myField').value;
var valByName = document.querySelector('[name="myField"]').value;

A safe fallback for name-based inputs:

var nodes = document.getElementsByName('myField');
if (nodes.length) val = nodes[0].value;

Troubleshooting checklist:

  • Make sure the element actually has the attribute you expect: id for id-based lookup, name for name-based lookup.
  • Run your code after the DOM is ready (move the script below the form or use DOMContentLoaded) so the element exists when accessed.
  • Avoid relying on old browser globals like document.formName — use document.forms[...] or selectors for predictable behavior.
  • Use the developer console to inspect document.forms and the element counts returned by getElementsByName to confirm you’re targeting the right node.

For reference on the DOM methods and recommended access patterns, see the MDN docs on form elements and selectors:
HTMLFormElement.elements and Document.querySelector.

Recommended Answers

All 4 Replies

Member Avatar for DangerDev

var fd="field_0";

here fd is a variable having value "field_0"

var a=document.form1.field_0.value;

here field_0 is an object inside form1.

so you cant do what you want to do ?
any way why actually you want this to be done ?
you can try alternatives like getElementById();
hope this helps !!!

Member Avatar for michael123

thanks, that help me.

Member Avatar for michael123

Another issue:
getElementById() works only in IE, if I try to use Firefox this will not work, how to solve this issue?

Member Avatar for ~s.o.s~

> I have a form text field called "field_0", and javascript code:

First of all, your markup is broken. The HTML tag attributes need to be in the form of key-value pairs with the value being enclosed in double quotes.

> However if I change a little in javascript code this script will no longer work

This is because your JS code now looks for an element with the name 'fd' instead of 'field_0'. Try something like document.form1[fd].value .

But the way you are accessing forms is fundamentally broken, read this excellent article on form access.

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.