Forum Moderators: open

Message Too Old, No Replies

Counting form fields

         

Arthalion

12:43 am on Apr 4, 2004 (gmt 0)

10+ Year Member



Interesting problem here. I have a webpage that is having a form dynamically built into it by a third party application server. This form is database driven and allows the user to enter information related to certain records in the database en masse. In other words, if there are 35 outstanding records, it will create 35 rows in a table and place 35 uniquely named text-fields in those rows so that the user can enter data about all of them on one screen. Depending on when it's accessed, however, there may be 35, 12, or 200 lines...it's completely random.

The primary user of this application has requested that I insert some default information into these text fields indicating the date they were last edited. The process of inserting text into a text form field with Javascript is very simple, but I first need a way to "count" the text fields on the screen to determine how many times I need to loop through the update process. Luckily, the fields have a regular naming convention, but I've never before tried to count the form fields on a page through javascript and don't know where to start.

The naming convention for the form fields is:
id ="Table#Grp:LIST.VAR2#row#1#col#2"
id ="Table#Grp:LIST.VAR2#row#2#col#2"
id ="Table#Grp:LIST.VAR2#row#3#col#2"
id ="Table#Grp:LIST.VAR2#row#4#col#2"
etcetera....

Note: I have absolutely no access to the code running in the application server, so there's no way I can just pass this information to the screen (that would be too easy). The server is generating this HTML page, and I need to figure out how to count and prepopulate these fields entirely on the client side using only Javascript.

Rambo Tribble

2:14 am on Apr 4, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



See if this answers your question:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/javascript">
<!--
function giveIns(){
var el_no=document.forms[0].elements.length;
alert(el_no);
}
//-->
</script>
</head>
<body onload="giveIns();">
<form>
<input type="text" size="30" />
<input type="text" size="30" />
<input type="text" size="30" />
</form>
</body>
</html>

Note that forms[].elements counts all the elements in a form, so you may have to make adjustments if there are additional elements within the form besides the ones you wish to enumerate. forms[].elements is an array itself, so that the first input field in this example could have a value of "text" assigned to it by:
document.forms[0].elements[0].value = "text"

Alternatively you could use document.getElementsByTagName("input") to return an array of just the input tags, but again all input tag types would be counted.