How can I get the value of a form input whose name is in a Javascript variable?

N

neelay1

Hi all,
I have a Javascript variable that contains the name of a form input-
input_name = "document.myform.ip"
How can I get the value of this form input, "ip" using the variable
input_name?
input_name.value returns undefined value and input_name + ".value"
returns the string document.myform.ip.value
Any help will be highly appreciated.

Thanks,
Neelay.
 
M

Matt Kruse

I have a Javascript variable that contains the name of a form input-
input_name = "document.myform.ip"

First, reference forms correctly:
http://www.javascripttoolbox.com/bestpractices/new.php#forms

document.myform is not a good idea.
How can I get the value of this form input, "ip" using the variable
input_name?

Second, instead of your code, do:

var form_name = "myform";
var input_name = "ip";

then

var value=document.forms[form_name].elements[input_name].value;

See http://www.javascripttoolbox.com/bestpractices/new.php#squarebracket

If there is absolutely no way to avoid having

input_name = "document.forms.myform.ip";

then you would need to use eval:

eval("var value = "+input_name+".value");

But this is discouraged:
http://www.javascripttoolbox.com/bestpractices/new.php#eval
 
R

Richard Cornford

andy baxter wrote:
document.myform.id. Also, I think this syntax only works in
internet explorer - you're better using something like:

if (document.getElementById) {
input_name=document.getElementById("ip");
}

and setting the 'id' property of the form input to 'ip'
<snip>

The 'shortcut' form accessor properties are widely (apparently
universally) supported in HTML DOMs. The normal recommended method is to
access form controls through the W3C standard - document.forms -
collection and then through the - elements - collection of the form
element (that approach being back-compatible with 'shortcut' supporting
browsers, W3C DOM standard and available in XHTML DOMs):-

<URL: http://jibbering.com/faq/faq_notes/form_access.html >

Richard.
 
L

Lasse Reichstein Nielsen

Matt Kruse said:
If there is absolutely no way to avoid having

input_name = "document.forms.myform.ip";

then you would need to use eval:

eval("var value = "+input_name+".value");

"Need" is such a strong word :)

You can do it like that, and it's probably also the simplest
way, but it has absolutely no validation of the format of the
input string.

You could parse the string, something like:
---
// tests and captures: document[.forms].<formid>[.elements].<controlname>
var formRE = /^document(?:\.forms)?\.([$_a-zA-Z][$\w]*)(?:\.elements)?\.([$_a-zA-Z][$\w]*)$/;
// ...
var match = input_name.match(formRE);
if (formRE) {
var value = document.forms[match[1]].elements[match[2]];
}
---
Then you both test the input and avoid eval.

And mostly unnecessary.
There are *very* few things that can't be done without eval.
There are almost as few that is best done with eval.

/L
 
N

Noah Sussman

Here is an alternative way to parse property names. This method
doesn't validate the input, but it is generalized, and handles any
property name that gets passed to it.

function setNestedProperty(El, propName, myValue){
var propertyNameAsList = propName.split('.');
var myProp = El;
for (var i=0; i < propertyNameAsList.length; i++){
if (i == (propertyNameAsList.length - 1)){
myProp[ propertyNameAsList ] = myValue;
return;
}
myProp = myProp[ propertyNameAsList ];
}
}

setNestedProperty(myDiv, 'style.display', 'block');
setNestedProperty(myDiv, 'className', 'foo');
Matt Kruse said:
If there is absolutely no way to avoid having

input_name = "document.forms.myform.ip";

then you would need to use eval:

eval("var value = "+input_name+".value");

"Need" is such a strong word :)

You can do it like that, and it's probably also the simplest
way, but it has absolutely no validation of the format of the
input string.

You could parse the string, something like:
---
// tests and captures: document[.forms].<formid>[.elements].<controlname>
var formRE = /^document(?:\.forms)?\.([$_a-zA-Z][$\w]*)(?:\.elements)?\.([$_a-zA-Z][$\w]*)$/;
// ...
var match = input_name.match(formRE);
if (formRE) {
var value = document.forms[match[1]].elements[match[2]];
}
---
Then you both test the input and avoid eval.

And mostly unnecessary.
There are *very* few things that can't be done without eval.
There are almost as few that is best done with eval.

/L
 
N

Noah Sussman

Erm, I guess it would be nicer if I actually posted code that solved
the problem everyone was discussing in the first place :)

function getNestedPropertyValue(El, propName){
var propertyNameAsList = propName.split('.');
var myProp = El;
for (var i=0; i < propertyNameAsList.length; i++){
if (i == (propertyNameAsList.length - 1)){
return myProp[ propertyNameAsList ] ;
}
myProp = myProp[ propertyNameAsList ];
}
}

var fieldValue = getNestedPropertyValue(document,
'forms.postform.textbox.value');
var formsList = getNestedPropertyValue(document, 'forms');


Noah said:
Here is an alternative way to parse property names. This method
doesn't validate the input, but it is generalized, and handles any
property name that gets passed to it.

function setNestedProperty(El, propName, myValue){
var propertyNameAsList = propName.split('.');
var myProp = El;
for (var i=0; i < propertyNameAsList.length; i++){
if (i == (propertyNameAsList.length - 1)){
myProp[ propertyNameAsList ] = myValue;
return;
}
myProp = myProp[ propertyNameAsList ];
}
}

setNestedProperty(myDiv, 'style.display', 'block');
setNestedProperty(myDiv, 'className', 'foo');
Matt Kruse said:
If there is absolutely no way to avoid having

input_name = "document.forms.myform.ip";

then you would need to use eval:

eval("var value = "+input_name+".value");

"Need" is such a strong word :)

You can do it like that, and it's probably also the simplest
way, but it has absolutely no validation of the format of the
input string.

You could parse the string, something like:
---
// tests and captures: document[.forms].<formid>[.elements].<controlname>
var formRE = /^document(?:\.forms)?\.([$_a-zA-Z][$\w]*)(?:\.elements)?\.([$_a-zA-Z][$\w]*)$/;
// ...
var match = input_name.match(formRE);
if (formRE) {
var value = document.forms[match[1]].elements[match[2]];
}
---
Then you both test the input and avoid eval.

And mostly unnecessary.
There are *very* few things that can't be done without eval.
There are almost as few that is best done with eval.

/L
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top