473,395 Members | 1,689 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

home > topics > javascript > questions > trying to totalise and validate form

Join Bytes to post your question to a community of 473,395 software developers and data experts.

Trying to totalise and validate form

Hi

I'm having a bit of bother trying to make a questionnaire do what I
want it to. I have put it up on www.web-iq.co.uk/test.htm.

Basically the user of the final form (when I've tarted it up) will have
to choose 1 answer per line, which are added up in the totals below.
I've made four separate forms each of which totalises the number of
checked elements in it - ie. column one is its own form, similarly
column 2 etc.

All this is fine but at the moment the user can choose more than one
answer per row, which distorts the totals.

I tried experimenting with radiobuttons instead, but couldn't make it
work with unchecking.

I'm not great at javascript, so any help appreciated.

Page code below.

Thanks - Tim P

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"
/>
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
background-color: #CCCCFF;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
function calculate2() {
var elems = document.forms['form2'].elements;
var total = 0;
for(var i=0;i<elems.length;i++) {
if (elems[i].checked) {total += +(elems[i].value);}
}
elems['Tot1'].value = total;
}
function calculate3() {
var elems = document.forms['form3'].elements;
var total = 0;
for(var i=0;i<elems.length;i++) {
if (elems[i].checked) {total += +(elems[i].value);}
}
elems['Tot2'].value = total;
}
function calculate4() {
var elems = document.forms['form4'].elements;
var total = 0;
for(var i=0;i<elems.length;i++) {
if (elems[i].checked) {total += +(elems[i].value);}
}
elems['Tot3'].value = total;
}
function calculate5() {
var elems = document.forms['form5'].elements;
var total = 0;
for(var i=0;i<elems.length;i++) {
if (elems[i].checked) {total += +(elems[i].value);}
}
elems['Tot4'].value = total;
}
//-->
</script>
</head>

<body>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%"><form action="" method="post" name="form2"
id="form2">
<table width="100%" border="0" cellspacing="2" cellpadding="0">
<tr>
<td bgcolor="#fff76a"><div align="center">ONE</div></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb1-1" type="checkbox"
onclick="calculate2()" id="cb1" value="1" /></td>
<td width="76%" class="smalltext">Boasts and brags </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb2-1" type="checkbox"
onclick="calculate2()" id="cb2-1" value="1" /></td>
<td width="76%" class="smalltext">Dominates</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb3-1" type="checkbox"
onclick="calculate2()" id="cb3-1" value="1" /></td>
<td width="76%" class="smalltext">Interrupts</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb4-1" type="checkbox"
onclick="calculate2()" id="cb4-1" value="1" /></td>
<td width="76%" class="smalltext">Self centered </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb5-1" type="checkbox"
onclick="calculate2()" id="cb5-1" value="1" /></td>
<td width="76%" class="smalltext">Focus on own success
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb6-1" type="checkbox"
onclick="calculate2()" id="cb6-1" value="1" /></td>
<td width="76%" class="smalltext">Strong views </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb7-1" type="checkbox"
onclick="calculate2()" id="cb7-1" value="1" /></td>
<td width="76%" class="smalltext">Negative statements
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb8-1" type="checkbox"
onclick="calculate2()" id="cb8-1" value="1" /></td>
<td width="76%" class="smalltext">Values status </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb9-1" type="checkbox"
onclick="calculate2()" id="cb9-1" value="1" /></td>
<td width="76%" class="smalltext">Rarely gives credit
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb10-1" type="checkbox"
onclick="calculate2()" id="cb10-1" value="1" /></td>
<td width="76%" class="smalltext">Strong desire to win
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb11-1" type="checkbox"
onclick="calculate2()" id="cb11-1" value="1" /></td>
<td width="76%" class="smalltext">Likes status symbols
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb12-1" type="checkbox"
onclick="calculate2()" id="cb12-1" value="1" /></td>
<td width="76%" class="smalltext">Keen for an argument
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFF76A">&nbsp;&nbsp;Total
<input name="Tot1" type="text" id="Tot1" size="2" /></td>
</tr>
</table>
</form></td>
<td width="25%"><form action="" method="post" name="form3"
id="form3">
<table width="100%" border="0" cellspacing="2" cellpadding="0">
<tr>
<td bgcolor="#fff76a"><div align="center">TWO</div></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb1-2" type="checkbox"
onclick="calculate3()" id="cb1-2" value="1" /></td>
<td width="76%" class="smalltext">Lacks confidence </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb2-2" type="checkbox"
onclick="calculate3()" id="cb2-2" value="1" /></td>
<td width="76%" class="smalltext">Tight lipped and closed
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb3-2" type="checkbox"
onclick="calculate3()" id="cb3-2" value="1" /></td>
<td width="76%" class="smalltext">Cautious</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb4-2" type="checkbox"
onclick="calculate3()" id="cb4-2" value="1" /></td>
<td width="76%" class="smalltext">Sits on the fence </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb5-2" type="checkbox"
onclick="calculate3()" id="cb5-2" value="1" /></td>
<td width="76%" class="smalltext">Procrastinates</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb6-2" type="checkbox"
onclick="calculate3()" id="cb6-2" value="1" /></td>
<td width="76%" class="smalltext">Indecisive</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb7-2" type="checkbox"
onclick="calculate3()" id="cb7-2" value="1" /></td>
<td width="76%" class="smalltext">Follows the leader
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb8-2" type="checkbox"
onclick="calculate3()" id="cb8-2" value="1" /></td>
<td width="76%" class="smalltext">Keeps a low profile
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb9-2" type="checkbox"
onclick="calculate3()" id="cb9-2" value="1" /></td>
<td width="76%" class="smalltext">Prefers solitude </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb10-2" type="checkbox"
onclick="calculate3()" id="cb10-2" value="1" /></td>
<td width="76%" class="smalltext">Works by the book </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb11-2" type="checkbox"
onclick="calculate3()" id="cb11-2" value="1" /></td>
<td width="76%" class="smalltext">Values tradition </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb12-2" type="checkbox"
onclick="calculate3()" id="cb12-2" value="1" /></td>
<td width="76%" class="smalltext">Pessimism</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFF76A">&nbsp;&nbsp;Total
<input name="Tot2" type="text" id="Tot2" size="2" /></td>
</tr>
</table>
</form></td>
<td width="25%"><form action="" method="post" name="form4"
id="form4">
<table width="100%" border="0" cellspacing="2" cellpadding="0">
<tr>
<td bgcolor="#fff76a"><div align="center">THREE</div></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb1-3" type="checkbox"
onclick="calculate4()" id="cb1-3" value="1" /></td>
<td width="76%" class="smalltext">Easy to get along with
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb2-3" type="checkbox"
onclick="calculate4()" id="cb2-3" value="1" /></td>
<td width="76%" class="smalltext">Agrees readily </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb3-3" type="checkbox"
onclick="calculate4()" id="cb3-3" value="1" /></td>
<td width="76%" class="smalltext">Positive and optimistic
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb4-3" type="checkbox"
onclick="calculate4()" id="cb4-3" value="1" /></td>
<td width="76%" class="smalltext">Talks a lot </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb5-3" type="checkbox"
onclick="calculate4()" id="cb5-3" value="1" /></td>
<td width="76%" class="smalltext">Goes off on a tangent
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb6-3" type="checkbox"
onclick="calculate4()" id="cb6-3" value="1" /></td>
<td width="76%" class="smalltext">Rarely criticises </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb7-3" type="checkbox"
onclick="calculate4()" id="cb7-3" value="1" /></td>
<td width="76%" class="smalltext">Disorganised</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb8-3" type="checkbox"
onclick="calculate4()" id="cb8-3" value="1" /></td>
<td width="76%" class="smalltext">Positive statements
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb9-3" type="checkbox"
onclick="calculate4()" id="cb9-3" value="1" /></td>
<td width="76%" class="smalltext">Sensitive to feedback
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb10-3" type="checkbox"
onclick="calculate4()" id="cb10-3" value="1" /></td>
<td width="76%" class="smalltext">Exaggerates</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb11-3" type="checkbox"
onclick="calculate4()" id="cb11-3" value="1" /></td>
<td width="76%" class="smalltext">Compromises</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb12-3" type="checkbox"
onclick="calculate4()" id="cb12-3" value="1" /></td>
<td width="76%" class="smalltext">Indecisive</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFF76A">&nbsp;&nbsp;Total
<input name="Tot3" type="text" id="Tot3" size="2" /></td>
</tr>
</table>
</form></td>
<td width="25%"><form action="" method="post" name="form5"
id="form5">
<table width="100%" border="0" cellspacing="2" cellpadding="0">
<tr>
<td bgcolor="#fff76a"><div align="center">FOUR</div></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb1-4" type="checkbox"
onclick="calculate5()" id="cb1-4" value="1" /></td>
<td width="76%" class="smalltext">Self confident </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb2-4" type="checkbox"
onclick="calculate5()" id="cb2-4" value="1" /></td>
<td width="76%" class="smalltext">Team player </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb3-4" type="checkbox"
onclick="calculate5()" id="cb3-4" value="1" /></td>
<td width="76%" class="smalltext">Willingly accepts help
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb4-4" type="checkbox"
onclick="calculate5()" id="cb4-4" value="1" /></td>
<td width="76%" class="smalltext">Candid and thorough
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb5-4" type="checkbox"
onclick="calculate5()" id="cb5-4" value="1" /></td>
<td width="76%" class="smalltext">Open to new ideas</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb6-4" type="checkbox"
onclick="calculate5()" id="cb6-4" value="1" /></td>
<td width="76%" class="smalltext">Listens first </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb7-4" type="checkbox"
onclick="calculate5()" id="cb7-4" value="1" /></td>
<td width="76%" class="smalltext">Gives credit when due
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb8-4" type="checkbox"
onclick="calculate5()" id="cb8-4" value="1" /></td>
<td width="76%" class="smalltext">Owns up to mistakes
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb9-4" type="checkbox"
onclick="calculate5()" id="cb9-4" value="1" /></td>
<td width="76%" class="smalltext">Explains fully </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb10-4" type="checkbox"
onclick="calculate5()" id="cb10-4" value="1" /></td>
<td width="76%" class="smalltext">Balanced reasoning
</td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb11-4" type="checkbox"
onclick="calculate5()" id="cb11-4" value="1" /></td>
<td width="76%" class="smalltext">Looks for win/win </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFFFFF"><table width="100%"
border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="24%"><input name="cb12-4" type="checkbox"
onclick="calculate5()" id="cb12-4" value="1" /></td>
<td width="76%" class="smalltext">Supports others </td>
</tr>
</table></td>
</tr>
<tr>
<td height="40" bgcolor="#FFF76A">&nbsp;&nbsp;Total
<input name="Tot4" type="text" id="Tot4" size="2" /></td>
</tr>
</table>
</form></td>
</tr>
</table>
</body>
</html>

Jul 8 '06 #1
5 1870
>
I'm having a bit of bother trying to make a questionnaire do what I
want it to. I have put it up on www.web-iq.co.uk/test.htm.
what the... is this questionnaire weekend?
Jul 8 '06 #2
wrote on 08 jul 2006 in comp.lang.javascript:
I'm having a bit of bother trying to make a questionnaire do what I
want it to. I have put it up on www.web-iq.co.uk/test.htm.

Basically the user of the final form (when I've tarted it up) will have
to choose 1 answer per line, which are added up in the totals below.
I've made four separate forms each of which totalises the number of
checked elements in it - ie. column one is its own form, similarly
column 2 etc.

All this is fine but at the moment the user can choose more than one
answer per row, which distorts the totals.

I tried experimenting with radiobuttons instead, but couldn't make it
work with unchecking.

I'm not great at javascript, so any help appreciated.
The first thing you have to do if thngs go bad,
is make a clean code you can grasp,
leaving out all the unneccesary parts.

Try this:

<table border=1>
<tr><td>

<table>
<tr>
<td><input type=checkbox id=r0c0 onclick='c(this)'blah
<td><input type=checkbox id=r0c1 onclick='c(this)'blah
<td><input type=checkbox id=r0c2 onclick='c(this)'blah
</table>

<tr><td>

<table>
<tr>
<td><input type=checkbox id=r1c0 onclick='c(this)'blah
<td><input type=checkbox id=r1c1 onclick='c(this)'blah
<td><input type=checkbox id=r1c2 onclick='c(this)'blah
</table>

<tr><td>

<table>
<tr>
<td><input type=checkbox id=r2c0 onclick='c(this)'blah
<td><input type=checkbox id=r2c1 onclick='c(this)'blah
<td><input type=checkbox id=r2c2 onclick='c(this)'blah
</table>

<tr><td>

<table>
<tr>
<td><input type=checkbox id=r3c0 onclick='c(this)'blah
<td><input type=checkbox id=r3c1 onclick='c(this)'blah
<td><input type=checkbox id=r3c2 onclick='c(this)'blah
</table>

<tr><td>

<table>
<tr>
<td>total <span id=c0>0</span>
<td>total <span id=c1>0</span>
<td>total <span id=c2>0</span>
</table>

</table>

<script type='text/javascript'>

function g(x){
return document.getElementById(x)
}

function c(x){

my = x.id
myRow = my.substr(1,1)
myCol = my.substr(3,1)

// only one or less checked this row:
if (x.checked)
for (var c=0;c<3;c++)
if (c!=myCol)
g('r'+myRow+'c'+c).checked=false;

// recomputes the 3 columns:
for (c=0;c<3;c++){
t=0
for (r=0;r<4;r++){
if (g('r'+r+'c'+c).checked)
t++
g('c'+c).innerHTML=t
}
}

}

</script>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jul 8 '06 #3
Thanks Evertjan

This works great!

I've extended it to 10 rows and 4 cols with no problem (i.e. last row
is 9). But when I go to 12 rows the last two don't select only one col
correctly. I can't see why this would be from your code - not that i'm
much cop at javascript....

I have a feeling it is the substring method on MyRow which is doing
this because sometimes I want to extract 2 chars and sometimes 1?

Sorry to be a pain, but can you see what I'm doing wrong?

Thanks again for your help.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"
/>
<title>Untitled Document</title>

</head>

<body>
<table border=0>
<tr><td width="366">
<table>
<tr>
<td><input type=checkbox id=r0c0 onclick='c(this)'blah
<td><input type=checkbox id=r0c1 onclick='c(this)'blah
<td><input type=checkbox id=r0c2 onclick='c(this)'blah
<td><input type=checkbox id=r0c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r1c0 onclick='c(this)'blah
<td><input type=checkbox id=r1c1 onclick='c(this)'blah
<td><input type=checkbox id=r1c2 onclick='c(this)'blah
<td><input type=checkbox id=r1c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r2c0 onclick='c(this)'blah
<td><input type=checkbox id=r2c1 onclick='c(this)'blah
<td><input type=checkbox id=r2c2 onclick='c(this)'blah
<td><input type=checkbox id=r2c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r3c0 onclick='c(this)'blah
<td><input type=checkbox id=r3c1 onclick='c(this)'blah
<td><input type=checkbox id=r3c2 onclick='c(this)'blah
<td><input type=checkbox id=r3c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r4c0 onclick='c(this)'blah
<td><input type=checkbox id=r4c1 onclick='c(this)'blah
<td><input type=checkbox id=r4c2 onclick='c(this)'blah
<td><input type=checkbox id=r4c3 onclick='c(this)'blah
</table>

<tr><td>
<table>
<tr>
<td><input type=checkbox id=r5c0 onclick='c(this)'blah
<td><input type=checkbox id=r5c1 onclick='c(this)'blah
<td><input type=checkbox id=r5c2 onclick='c(this)'blah
<td><input type=checkbox id=r5c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r6c0 onclick='c(this)'blah
<td><input type=checkbox id=r6c1 onclick='c(this)'blah
<td><input type=checkbox id=r6c2 onclick='c(this)'blah
<td><input type=checkbox id=r6c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r7c0 onclick='c(this)'blah
<td><input type=checkbox id=r7c1 onclick='c(this)'blah
<td><input type=checkbox id=r7c2 onclick='c(this)'blah
<td><input type=checkbox id=r7c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r8c0 onclick='c(this)'blah
<td><input type=checkbox id=r8c1 onclick='c(this)'blah
<td><input type=checkbox id=r8c2 onclick='c(this)'blah
<td><input type=checkbox id=r8c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r9c0 onclick='c(this)'blah
<td><input type=checkbox id=r9c1 onclick='c(this)'blah
<td><input type=checkbox id=r9c2 onclick='c(this)'blah
<td><input type=checkbox id=r9c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r10c0 onclick='c(this)'blah
<td><input type=checkbox id=r10c1 onclick='c(this)'blah
<td><input type=checkbox id=r10c2 onclick='c(this)'blah
<td><input type=checkbox id=r10c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td><input type=checkbox id=r11c0 onclick='c(this)'blah
<td><input type=checkbox id=r11c1 onclick='c(this)'blah
<td><input type=checkbox id=r11c2 onclick='c(this)'blah
<td><input type=checkbox id=r11c3 onclick='c(this)'blah
</table>
<tr><td>
<table>
<tr>
<td>total <span id=c0>0</span>
<td>total <span id=c1>0</span>
<td>total <span id=c2>0</span>
<td>total <span id=c3>0</span>
</table>
</table>
<script type='text/javascript'>
function g(x){
return document.getElementById(x)

}
function c(x){

my = x.id
myRow = my.substr(1,1)
myCol = my.substr(3,1)
// only one or less checked this row:
if (x.checked)
for (var c=0;c<4;c++)
if (c!=myCol)
g('r'+myRow+'c'+c).checked=false;
// recomputes the 4 columns:
for (c=0;c<4;c++){
t=0
for (r=0;r<12;r++){
if (g('r'+r+'c'+c).checked)
t++
g('c'+c).innerHTML=t
}
}

}
</script>
</body>
</html>

Jul 8 '06 #4
wrote on 08 jul 2006 in comp.lang.javascript:
I've extended it to 10 rows and 4 cols with no problem (i.e. last row
is 9). But when I go to 12 rows the last two don't select only one col
correctly. I can't see why this would be from your code - not that i'm
much cop at javascript....
Use double number rows starting at 10:

id=r10c3
id=r11c3

myRow = my.substr(1,2)
myCol = my.substr(4,1)
for (r=10;r<22;r++)
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jul 8 '06 #5

Evertjan. wrote:
Use double number rows starting at 10:

id=r10c3
id=r11c3

myRow = my.substr(1,2)
myCol = my.substr(4,1)
for (r=10;r<22;r++)
Hi Evertjan

Thanks for the reply - sorry I didn't thank you before - I've been away
and only got time to try out this code this morning.

As I said, I'm not good at javascript and I can't figure how to make
this work. I need the original definition of myRow and myCol for rows
1-10, so where do I put the new code please?

Sorry to be a nuisance and thanks again for your help.

Regards

TimP

Jul 13 '06 #6
New Post

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
how to validate a form
by: Techy | last post by:
I have two fields in my form so called : invoice and cash Now I want to validate this form on the client side with the help of javascript in such a way that if one of these fields is empy an...
Javascript
4
Ways to validate form before submitting
by: Wysiwyg | last post by:
I need to validate a form to ensure that all of the fields add up correctly. I can't do this while the user is entering data since validation needs to be done after the entry is completed. What's...
ASP.NET
9
Validate Multiple Text Boxes?
by: B-Dog | last post by:
I have a form that has about 10 text boxes on it, they all have to be filled out before submitting is there a quick way to make sure that none are null or do I have to call out each textbox? Say...
Visual Basic .NET
11
Using regexp to validate simple form
by: TokyoJ | last post by:
I run a small camp in Alaska for kids and my director is asking for a web form. Could someone please have a look and offer some advice on where I'm making mistake(s)? I'm using the RegExp function...
Javascript
10
Trying to run a function from onclick without activating the link
by: Carlos Araya | last post by:
I have the following link on a web page <p class="menuitem"><a href="#" onclick="loadFragment('http://rivendellweb.net/fortress/home', 'index')" title="The Fortress Home">The Fortress...
Javascript
2
trying AJAX in asp.net 2.0
by: Rahul | last post by:
I am trying the following thing in AJAX <atlas:ScriptManager ID="scriptmanager1" runat="Server" EnablePartialRendering="true" /> <asp:DropDownList ID="cmbBranchname" cssclass="Combostyle"...
ASP.NET
1
Validate input data type base on pull down selection
by: SkipNRun | last post by:
I am a novice when comes to JavaScript, AJAX. I am working on a form, which will allow users to update their contact information. In order to make the form flexible, I need to use pull down list. ...
Javascript
6
Log in form problems
by: Tomino | last post by:
Hi, I am working on a log in form for an Access 2003 db. Because the built-in jet database engine doesn't supply the ability to record every log attempt, failed attempt, validate passwords, user...
Microsoft Access / VBA
8
OOP: Problem implementing a add, edit, delete Contact form
by: chromis | last post by:
Hi, I'm writing a contacts section for a cms on a website, I've decided to write the section in OO code. So far I have my Contacts object and a page structure I would use for a procedural site. ...
ColdFusion
0
Batch import of multiple excel files into the database
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
Data Management
0
Merging data from multiple Excel files
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
Data Management
0
BarryA
Navigating the Data Structures and Algorithms (DSA)
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
Algorithms / Advanced Math
1
Looking to do Android software development, any suggestions? Is flutter better?
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
General
0
Changing the language in Windows 10
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
Windows Server
0
Oralloy
Problem With Comparison Operator <=> in G++
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
C / C++
0
jinu1996
Maximizing Business Potential: The Nexus of Website Design and Digital Marketing
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
Online Marketing
0
The easy way to turn off automatic updates for Windows 10/11
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
Windows Server
0
tracyyun
Discussion: How does Zigbee compare with other wireless protocols in smart home applications?
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
General

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.

BYTES.COM © 2024
About Bytes
Terms Of Use
Privacy Policy
Sitemap
Advertise on Bytes:
Post a Job
Sponsored Posts
Platinum & Gold Sponsors
Hire Now!