We help IT Professionals succeed at work.

We've partnered with Certified Experts, Carl Webster and Richard Faulkner, to bring you a podcast all about Citrix Workspace, moving to the cloud, and analytics & intelligence. Episode 2 coming soon!Listen Now

x

document.myform.elements.length not working - plus another related question

spw2000
spw2000 asked
on
Medium Priority
750 Views
Last Modified: 2013-11-18
I use PHP to construct a form 'myform' containing some members of a club -the names are extracted from a mySQL database -  I want to use the checkbox for later action.  The "phrase" used to construct the checkbox next to each is as follows:
<input type='checkbox' name='addme' id='addme' onClick='addthis()'>

As expcted I can get addthis() to activate BUT I cannot get document.myform.addme.length (or any variations of this to give me anything other than "undefined".  Very annoying.

Each member has a unique membership ID - Second issue is that I want to use addthis() to ab able to populate another  array with the membership id according to the position (element aray postion) of any particular checkbox - however I cannot find the position of the checkbox without looping through all (potentially 500 plus names) - also this method doesnt work as any number of checkboxes may be checked.  I need a checkbox to be able to "reports its array element number"...  I hope that makes sense.

Any suggestions welcome please......

Relevant extracts:
 
<script type="text/javascript">
var nummems = document.addmemform.addme.length;
var aaaa = new Array();
var bbbb = new Array();
 
function addthis() { 
	alert(nummems);
}
</script>
 
// AND:
 
if ($listaction == "ADDMEMS") {
 
	$sqlquery="SELECT DISTINCT * FROM maillist WHERE list_id ='$listid'";
	$sqlresult = mysql_query($sqlquery)or die ('LISTMAINT: Unable to retrieve mail list information' . mysql_error());
	if (mysql_num_rows($sqlresult) == 1 ) {
		$r_listid = mysql_result($sqlresult, 0, 'list_id');
		$r_listtitle = mysql_result($sqlresult, 0, 'list_title');
 
		print"
		<body>
		<center>
		<form name='listmemform' id='listmemform' action='kbvsac-listmemsmaint.php' method='POST'>
		<table width='700' border='1' align='center' cellpadding='8' cellspacing='0' bgcolor='#CCCC99'>
			<tr>
			<td bgcolor='#CCCCCC'>
			<center>
			<font size='2' face='Tahoma'><br>
			ADD CONTACTS TO: ".$r_listtitle; 
		print "<br>
			<br>
			</font></center>
			</td>
			</tr>
			<tr>
  	 		 <tr><td>";
 
 
		$sqlquery="SELECT * FROM members WHERE mem_id NOT IN (SELECT mem_id FROM listmems WHERE listmems.list_id ='$listid') ORDER BY members.lastname ASC" ;
		$sqlresult = mysql_query($sqlquery)or die ('LISTMAINT: Unable to retrieve contact information' . mysql_error());
		$num_rows = mysql_num_rows($sqlresult);
		if ($num_rows > 0) {
			print "<form name='addmemform' id='addmemform'><table width='80%' align='center' border='0' cellpad='4'>
				<tr><td width='8%'><font size='2' face='Tahoma'><b>ADD</b></font></td>
				<td width='40%'><font size='2' face='Tahoma'><b>CONTACT</b></font></td>
				<td ><font size='2' face='Tahoma'><b>EMAIL</b></font></td></tr><tr>";
			$i = 0;
			while ($i < $num_rows ) {
				print "<td><input type='checkbox' name='addme' id='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>".mysql_result($sqlresult, $i, 'lastname').", ".mysql_result($sqlresult, $i, 'firstname')."</font></td><td><font size='2' face='Tahoma'>".mysql_result($sqlresult, $i, 'email')."</font></td><tr>";
/*mysql_result($sqlresult, $i, 'mem_id')  */
				$i++;
			}
	
		print "<input type='hidden'>
			</form></table></td></tr><tr>
			<td align='center' bgcolor='#CCCCCC'>
   			<button style='width:150' onClick=\"window.location='kbvsac-lists.php'; return false;\">CANCEL</button>
			&nbsp;&nbsp;&nbsp;&nbsp;   		
			<button style='width:150' onClick=\"window.location='kbvsac-lists.php'; return false;\">SAVE</button>
			</td>
			</tr>
		</table>
		</center>
		<form name='listmemform' id='listmemform' action='../kbvsac/kbvsac-listmemsmaint.php' method='POST'>
       		<input type='hidden' name='listid' id="; echo $r_listid; print " 
       		<input type='hidden' name='listtitle' id="; echo $r_listtitle; print "
		</form>
		";
		}
		else print "<p align='center'>No contacts left to go onto list...<p>";	
	}
}

Open in new window

Comment
Watch Question

Commented:
below is the example how to access checkboxes - it works in FF3 and IE6. It might have something to do with using the same id many times. Id is supposed to be unique.

<html>
  <head>
    <title></title>
    <meta content="">
    <style></style>
  </head>
  <body>
<form name="myform">
check1 <input type='checkbox' name='addme' onClick='addthis()'><br>
check2 <input type='checkbox' name='addme' onClick='addthis()'><br>
<script type="text/javascript">
alert(document.myform.addme.length);
</script>
</form>
</body>
</html>

Open in new window

Author

Commented:
Thanks for the reply - I removed the id='addme' but same result - still get "undefined" for both document.addmemform.addme.length and document.addmemform.elements.length.

Not sure if you saw the attached code - was added in some minutes after I submitted the question the first tiem - it did however still have the id='addme' in it.

What else should I be looking at???

Commented:
It would be helpful if you post the exact html that is produced by your script. (View > Page source).

Author

Commented:
As requested - was actually just preparin that when you asked..
:)
I did truncate it as the full page has hundreds of members listed.

Your code worked but when I adjusted my code to get rid of the duplicating id='addme" it made no difference - hopefully you can spot what i did wrong??

<html>
<head>
<title>Kiteboarding Victoria</title>
<meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1'>
<meta name='Keywords' content='KBV, kbv.org.au, kite, beach, kitebeach, kites, kitesurf, kitesurfer, kitesurfing, board, kiteboard, kiteboarding, kiting, elwood, st.kilda, brighton, gelong, point henry, inverloch, naish, cabrinha, ocean rodeo, north, slingshot, wake, wakeboard, directional, weather, wind, tuition, safety, loops, wind, lessons, boost, air, sail, rig, lines, pump'>	
<meta name='Description' content='Kiteboading Victoria, Melbourne, Australia. Kitesurfing community, weather reports, events, news, pictures, locals, etc'>
<style type='text/css'>
a:link{ text-decoration: none; color:#003366 }
a:visited{ text-decoration: none; color:#003366 }
a:hover{ text-decoration: underline; color:#FFFFFF }
</style>
 
<!--
 
<script type="text/javascript" src="../ajax/dojoroot/dojo/dojo.js"
    djConfig="parseOnLoad: true">
</script>
 
<style type="text/css">
	@import "../ajax/dojoroot/dijit/themes/tundra/tundra.css";
	@import "../ajax/dojoroot/dojo/resources/dojo.css";
</style>
 
<script type="text/javascript">
// Load Dojo's code relating to the Button widget
	dojo.require("dijit.form.Button");
</script>
 
<script type="text/javascript">
function ajaxPutback(data,ioArgs) {
	if (data == '1')  {
		window.location='kbvsac-lists.php';
	}
	else {
		alert (data);
	}
}
 
function ajaxError(data, ioArgs) {
	alert(data);
	alert('Error when retrieving/saving data on the server!');
}
 
-->
<script type="text/javascript">
 
var nummems = document.addmemform.elements.length;	
var aaaa = new Array();
var bbbb = new Array();
 
function addthis() { 
	alert(document.addmemform.addme.length);
}
</script>
 
 
</head>
 
<body background='../images/blue-bg.jpg' topmargin='0' font='Tahoma' size='2' color='#000000'>
<center>
<table width='800' border='0' cellspacing='0' cellpadding='0'>
   <tr>
      <td>
 
		<body>
		<center>
		<form name='listmemform' id='listmemform' action='kbvsac-listmemsmaint.php' method='POST'>
		<table width='700' border='1' align='center' cellpadding='8' cellspacing='0' bgcolor='#CCCC99'>
			<tr>
			<td bgcolor='#CCCCCC'>
			<center>
			<font size='2' face='Tahoma'><br>
			ADD CONTACTS TO: This is a new one!! so there...<br>
			<br>
			</font></center>
			</td>
			</tr>
			<tr>
  	 		 <tr><td><form name='addmemform' id='addmemform'><table width='80%' align='center' border='0' cellpad='4'>
				<tr><td width='8%'><font size='2' face='Tahoma'><b>ADD</b></font></td>
				<td width='40%'><font size='2' face='Tahoma'><b>CONTACT</b></font></td>
				<td ><font size='2' face='Tahoma'><b>EMAIL</b></font></td></tr><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Abbey, Campbell</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Adnam, Fin</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Aitken, Beth</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Alexander, Michael</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Allan, Darren</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Allen-Craig, Campbell</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Almagor, Daniel</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Andersen, Morten</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Anderson, Boombie</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Anderson, Matt</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Anderson-nicholls, Thom</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Anderton, Spencer</font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>ANDRIEU, JOHAn </font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr><td><input type='checkbox' name='addme' onClick='addthis()'></td><td><font size='2' face='Tahoma'>Armsby, John </font></td><td><font size='2' face='Tahoma'>abc@def.gh</font></td><tr>
.
.truncated here
.
<tr></form></table></td></tr><tr>
			<td align='center' bgcolor='#CCCCCC'>
   			<button style='width:150' onClick="window.location='kbvsac-lists.php'; return false;">CANCEL</button>
			&nbsp;&nbsp;&nbsp;&nbsp;   		
			<button style='width:150' onClick="window.location='kbvsac-lists.php'; return false;">SAVE</button>
			</td>
			</tr>
		</table>
		</center>
		<form name='listmemform' id='listmemform' action='../kbvsac/kbvsac-listmemsmaint.php' method='POST'>
       		<input type='hidden' name='listid' id=3 
       		<input type='hidden' name='listtitle' id=This is a new one!! so there...
		</form>
		
      </td>
   </tr>
</table>
</center>
<style type='text/css'>
 
<!--
.footer {
	font-family: Tahoma;
	font-size: 10px;
	color: #003366;
}
-->
</style>
 
<br />
<div align='center'>
<img src='../images/kbv-below.jpg'/><br>
<table width='808' border='0' cellspacing='0' bgcolor='CCCC99' bordercolor='CCCC99'>
<tr>
<td align='center'>
<span class='footer'>
<a href='../kbvmain/kbv-sitemain.php' target='mainFrame'>Home</a> <font color='#000000'><b>|</b></font> 
<a href='../kbvmain/kbv-privacy.php' target='mainFrame'>Privacy Policy</a><font color='#000000'><b>|</b></font> 
<a href='../kbvmain/kbv-sitemap.php' target='mainFrame'>Site Map</a><font color='#000000'><b>|</b></font> 
<a href='../kbvmain/kbv-signup.php' target='mainFrame'>Sign Up</a><font color='#000000'><b>|</b></font> 
<a href='../kbvmain/kbv-contact.php' target='mainFrame'>Contact Us</a><p>
<a href='http://www.spw-web.com' target = '_Blank'><img src='../images/sitemby.gif' width='130' height='26' border='0' usemap='#Map' longdesc='Site maintained by spw-online' ></a>
<br>
Copyright &copy; KiteBoarding Victoria (KBV) 2008/9 ALL RIGHTS RESERVED
<map name='Map' id='Map'>
   <area shape='rect' coords='-8,-3,128,26' href='http://www.spw-web.com' target='_blank' alt='Site maintained by spw-online' />
</map>   
</p>
</td>
</tr>
</table>
</div>
</body>
</html>

Open in new window

Commented:
First of all, you've got two forms named the same "listmemform", which is probably ok, but not very consistent.
The real problem is, that you have a form in a form like:

<form> ... <form>here's the form you want to access</form> ... </form>

Turn it to:

<form>......</form>
<form>here's the form you want to access</form>

and it should work.

Author

Commented:
Thanks - that was it - actually removed the other form and can put it in later if I need to.

NOW for the real problem - for ease I will use your code - what I want to achieve is by clicking on a check box I need to know what # in the element array it is - need to do this without looping through all elements each timeas the form can potentially have hundreds of name - the current onbe has 615 names.
// what i really would like to have:
function addthis() {
	Something simple that will show '0' when i click the first checkbox, '3' when i click check4, etc etc - but without having to loop through each time...
}
 
document.myform.addme.length works fine in the following:
 
 
<html>
  <head>
    <title></title>
    <meta content="">
    <style></style>
 
<script type="text/javascript">
function addthis() {
	alert(document.myform.addme.length);
}
</script>
 
 </head>
  <body>
<form name="myform">
<table>
<tr><td>check1 <input type='checkbox' name='addme' onClick='addthis()'></td></tr>
<tr><td>check2 <input type='checkbox' name='addme' onClick='addthis()'></td></tr>
<tr><td>check3 <input type='checkbox' name='addme' onClick='addthis()'></td></tr>
<tr><td>check4 <input type='checkbox' name='addme' onClick='addthis()'></td></tr>
<tr><td>check5 <input type='checkbox' name='addme' onClick='addthis()'></td></tr>
</table>
</form>
</body>
</html>
 
<body>
</body>
</html>

Open in new window

Commented:
You can produce the numbers with some counter increased with each loop.
<script>
function addthis(key)
{
  var input = document.myform.addme[key];
}
</script>
 
<form name="myform">
<table>
<tr><td>check1 <input type='checkbox' name='addme' onClick='addthis(0)'></td></tr>
<tr><td>check2 <input type='checkbox' name='addme' onClick='addthis(1)'></td></tr>
<tr><td>check3 <input type='checkbox' name='addme' onClick='addthis(2)'></td></tr>
<tr><td>check4 <input type='checkbox' name='addme' onClick='addthis(3)'></td></tr>
<tr><td>check5 <input type='checkbox' name='addme' onClick='addthis(4)'></td></tr>
</table>
</form>

Open in new window

Not the solution you were looking for? Getting a personalized solution is easy.

Ask the Experts

Author

Commented:
My thanks for your persistence - I agree - there does not seem to be any other way - I did something less elegant (see attAched)  than your suggestion using a unique id based on the same counter principle - only problem is that I then have to strip off some text to be left with a number - suppose an ID could be numeric but i am sure that is not good practice.  

I will go with your one instead. My thanks again - it is 1:am here in Australia so a good time to call it quits for the day...
<html>
  <head>
    <title></title>
    <meta content="">
    <style></style>
 
<script type="text/javascript">
function addthis(thisid) {
	var xx = thisid.substr(2);
	alert(xx);
}
</script>
 
 </head>
  <body>
<form name="myform">
<table>
<tr><td>check1 <input type='checkbox' name='addme' id='cb0' onClick='addthis(this.id)'></td></tr>
<tr><td>check2 <input type='checkbox' name='addme' id='cb1' onClick='addthis(this.id)'></td></tr>
<tr><td>check3 <input type='checkbox' name='addme' id='cb2' onClick='addthis(this.id)'></td></tr>
<tr><td>check4 <input type='checkbox' name='addme' id='cb3' onClick='addthis(this.id)'></td></tr>
<tr><td>check5 <input type='checkbox' name='addme' id='cb4' onClick='addthis(this.id)'></td></tr>
<tr><td>check6 <input type='checkbox' name='addme' id='cb5' onClick='addthis(this.id)'></td></tr>
<tr><td>check7 <input type='checkbox' name='addme' id='cb6' onClick='addthis(this.id)'></td></tr>
<tr><td>check8 <input type='checkbox' name='addme' id='cb7' onClick='addthis(this.id)'></td></tr>
<tr><td>check9 <input type='checkbox' name='addme' id='cb8' onClick='addthis(this.id)'></td></tr>
<tr><td>check10 <input type='checkbox' name='addme' id='cb9' onClick='addthis(this.id)'></td></tr>
<tr><td>check11 <input type='checkbox' name='addme' id='cb10' onClick='addthis(this.id)'></td></tr>
<tr><td>check12 <input type='checkbox' name='addme' id='cb11' onClick='addthis(this.id)'></td></tr>
<tr><td>check13 <input type='checkbox' name='addme' id='cb12' onClick='addthis(this.id)'></td></tr>
<tr><td>check14 <input type='checkbox' name='addme' id='cb13' onClick='addthis(this.id)'></td></tr>
<tr><td>check15 <input type='checkbox' name='addme' id='cb14' onClick='addthis(this.id)'></td></tr>
<tr><td>check15 <input type='checkbox' name='addme' id='cb15' onClick='addthis(this.id)'></td></tr>
<tr><td>check16 <input type='checkbox' name='addme' id='cb16' onClick='addthis(this.id)'></td></tr>
<tr><td>check17 <input type='checkbox' name='addme' id='cb17' onClick='addthis(this.id)'></td></tr>
<tr><td>check18 <input type='checkbox' name='addme' id='cb18' onClick='addthis(this.id)'></td></tr>
<tr><td>check19 <input type='checkbox' name='addme' id='cb19' onClick='addthis(this.id)'></td></tr>
</table>
</form>
</body>
</html>
 
<body>
</body>
</html>

Open in new window

Access more of Experts Exchange with a free account
Thanks for using Experts Exchange.

Create a free account to continue.

Limited access with a free account allows you to:

  • View three pieces of content (articles, solutions, posts, and videos)
  • Ask the experts questions (counted toward content limit)
  • Customize your dashboard and profile

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.