469,077 Members | 1,383 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,077 developers. It's quick & easy.

dynamic checkboxes

Hello!

I need help to modify the following javascript:

[HTML]<script language="javascript">

var flds = "chk1,chk2,chk3,chk4".split(",")
var vals = new Array(2,4,8,16)
var msgs = new Array();

msgs[0] = 'None checked';

msgs[2] = '1 checked';

msgs[4] = '2 checked';
msgs[6] = '2 & 1 checked';

msgs[8] = '3 checked';
msgs[10] = '3 & 1 checked';
msgs[12] = '3 & 2 checked';
msgs[14] = '3 & 2 & 1 checked';

msgs[16] = '4 checked';
msgs[18] = '4 & 1 checked';
msgs[20] = '4 & 2 checked';
msgs[22] = '4 & 2 & 1 checked';
msgs[24] = '4 & 3 checked';
msgs[26] = '4 & 3 & 1 checked';
msgs[28] = '4 & 3 & 2 checked';
msgs[30] = '4 & 3 & 2 & 1 checked';

function chkBoxProc (fld) {
var val = 0;

for (i=0;i<flds.length;i++) {
val += (fld.form.elements[flds[i]].checked)?vals[i]:0;
}
document.getElementById ('msg').innerHTML = msgs[val];

}
</script>
<form>
<input type="checkbox" name="chk1" onClick="chkBoxProc(this)">1<br />
<input type="checkbox" name="chk2" onClick="chkBoxProc(this)">2<br />
<input type="checkbox" name="chk3" onClick="chkBoxProc(this)">3<br />
<input type="checkbox" name="chk4" onClick="chkBoxProc(this)">4<br />

<span id="msg">None checked</span>

</form>[/HTML]

In the end I have about 10 checkboxes, which I want to display by this method. When I wrote this script in the way as you can see above it would take me at least 3 weeks.

Who can help me out to make the script more dynamic?

Finally I would replace the array values with some html-code which contains more form elements (checkboxes...) - is that possible too?

Thank you!
-w
Nov 19 '06 #1
1 4389
Honestly speaking you didnt explained your problem specifically,I didnt understand what ur problem is,but as far as I understood am sending this code.Hope it will help u.

<html>
<title>CodeAve.com(Checkbox Input Validation)</title>
<body bgcolor="#FFFFFF">

<script Language="JavaScript">
<!--
function checkbox_checker()
{

// set var checkbox_choices to zero

var checkbox_choices = 0;

// Loop from zero to the one minus the number of checkbox button selections
for (counter = 0; counter < checkbox_form.checkbox.length; counter++)
{

// If a checkbox has been selected it will return true
// (If not it will return false)
if (checkbox_form.checkbox[counter].checked)
{ checkbox_choices = checkbox_choices + 1; }

}


if (checkbox_choices > 3 )
{
// If there were more than three selections made display an alert box
msg="You're limited to only three selections.\n"
msg=msg + "You have made " + checkbox_choices + " selections.\n"
msg=msg + "Please remove " + (checkbox_choices-3) + " selection(s)."
alert(msg)
return (false);
}


if (checkbox_choices < 3 )
{
// If there were less then selections made display an alert box
alert("Please make three selections. \n" + checkbox_choices + " entered so far.")
return (false);
}

// If three were selected then display an alert box stating input was OK
alert(" *** Valid input of three outfielders was entered. ***");
return (true);
}

-->
</script>


<form method="get" action="#"
onsubmit="return checkbox_checker()" name="checkbox_form">
<input type="checkbox" value="A" name="checkbox">A<br>
<input type="checkbox" value="B" name="checkbox">B<br>
<input type="checkbox" value="C" name="checkbox">C<br>
<input type="checkbox" value="D" name="checkbox">D<br>
<input type="checkbox" value="E" name="checkbox">E<br>
<input type="checkbox" value="F" name="checkbox">F<br>
<input type="checkbox" value="G" name="checkbox">G<br>
<input type="checkbox" value="H" name="checkbox">H<br>
<input type="checkbox" value="I" name="checkbox">I<br>
<input type="checkbox" value="J" name="checkbox">J<br>
<input type="checkbox" value="K" name="checkbox">K<br>
<input type="checkbox" value="L" name="checkbox">L<br>
<input type="checkbox" value="M" name="checkbox">M<br>
<input type="checkbox" value="N" name="checkbox">N<br>
<input type="checkbox" value="O" name="checkbox">O<br>
<input type="submit" value="Submit">
</form>

</body>
</html>
Nov 20 '06 #2

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

reply views Thread by Frank Collins | last post: by
3 posts views Thread by Leo J. Hart IV | last post: by
3 posts views Thread by Jack Black | last post: by
34 posts views Thread by clinttoris | last post: by
reply views Thread by zhoujie | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.