Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

getting form elements

Status
Not open for further replies.

ashiers

Programmer
Jun 17, 2005
4
CA
Hi there,

I do server-side programming using JSP's (Java Server Pages). The HTML and javascript code is created dynamically. The page will contain a form. However, the contents of the form may vary with numerous textfields. So, the number of fields in the form will vary as will their values. When I create a page and it loads in the clients browser, I need some javascript code that will determine what fields are present in the form, their names and values. I need to do something like this:
Code:
function getElements(form)
{
   var elements = new Array();
   elements = form.getElements(); //of course, there's no such function!
   var names = new Array();
   var values = new Array();
   for(i = 0; i < elements.length; i++)
   {
      names[i] = elements[i].name;
      values[i] = elements[i].value;
   }
   ...
   ... do something with the names and value arrays...
}
Is this possible to do in javascript? Is there a way to determine what elements are in a form, like getting an enumeration of the objects therein?

Alan
 
ashiers,

If I may make a suggestion, you could use the form field as the index like this:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
  <title>Field Loader</title>
<script>
var fields = new Object();

function load_em(form){
for(var k = 0; k < form.elements.length; k++){
		if(form.elements[k].type == 'text' || 
		form.elements[k].type == 'textarea') {
		fields[form.elements[k].name] = form.elements[k].value;
		}
	}
for(var f in fields){
alert(f + " : " + fields[f]);
 }
}
</script>  
</head>
<body>
<form onsubmit="return ckStr(this)">
<textarea name="ta1" rows="3" cols="12">
</textarea>

<input type="text" name="tb1">
<input type="button" value="Load 'em" onclick="load_em(this.form)">
</form>

</body>
</html>


Hope it's helpful.

Good Place to "Learn More">>
 
You really don't need to loop through and create your own array at all - there is already one present (you were pretty close in your original post) - the "elements" collection:

Code:
yourForm.elements

Each item has a name and a value (assuming the fields do):

Code:
var s = '';
for (var loop=0; loop<yourForm.elements.length; loop++) {
   s += yourForm.elements[loop].name + ': ' + yourForm.elements[loop].value + '\n';
}
alert(s);

Hope this helps,
Dan

[tt]D'ya think I got where I am today because I dress like Peter Pan here?[/tt]
[banghead]

 
Wow. This is great. The code you guys provided was just what I was looking for.

Thanks,

Alan
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top