JavaScripts.ma.cx - Your JavaScript Resource - Forms

Free Scripts

Home > Forms > Select One 2

Script Title: Select One 2

Description: This scripts demonstrates how I limited only one selection by deselecting all others and how you can retrieve the value of the box you are selecting.

Example:

Credit: Script created by Mike Best

Download Script: Click here to download a .exe file of this script.

Copy the following code into your HEAD tags.

<script language="javascript"> // by Mike Best mike.best@hei-usa.com // More scripts like this at http://www.java-scripts.ma.cx // Check Box Validater only one selection allowed function checkBoxValidate(cb,gp,grp){ if(grp=="g1"){ var gn=gp.g1 var len=4 var lx=gp.v1 } if(grp=="g2"){ var gn=gp.g2 var len=4 var lx=gp.v2 } for (j=0; j < len ; j++ ){ if(gn[j].checked==true){ gn[j].checked = false } if(j == cb){ gn[j].checked=true lx.value=gn[j].value } } } </script>

Copy the following code into the BODY of your html page.

<form name=myform method=post> <table border=1 width='90%' align=center> <tr> <td width='50%' align=center><font face=ARIAL,VERDANA size=2>Value <input type='text' name='v1'> </td> <td width='50%' align=center><font face=ARIAL,VERDANA size=2>Value <input type='text' name='v2'></td> </tr> <tr> <td width='50%' align=center><font face=ARIAL,VERDANA size=2> <center> Group 1<br> Selection 1<input value=3.45 type="checkbox" name="g1" onClick="javascript:checkBoxValidate(0,this.form,this.name)" value="ON"><br> Selection 2<input value=5.66 type="checkbox" name="g1" onClick="javascript:checkBoxValidate(1,this.form,this.name)" value="ON"><br> Selection 3<input value=7 type="checkbox" name="g1" onClick="javascript:checkBoxValidate(2,this.form,this.name)" value="ON"><br> Selection 4<input value=100.56 type="checkbox" name="g1" onClick="javascript:checkBoxValidate(3,this.form,this.name)"> </center> </td> <td width='50%' align=center><font face=ARIAL,VERDANA size=2> Group 2<br> Selection 5<input value="This" type="checkbox" name="g2" onClick="javascript:checkBoxValidate(0,this.form,this.name)" value="ON"><br> Selection 6<input value="is" type="checkbox" name="g2" onClick="javascript:checkBoxValidate(1,this.form,this.name)" value="ON"><br> Selection 7<input value="a" type="checkbox" name="g2" onClick="javascript:checkBoxValidate(2,this.form,this.name)" value="ON"><br> Selection 8<input value="Test" type="checkbox" name="g2" onClick="javascript:checkBoxValidate(3,this.form,this.name)"><br> </td> </tr> </table> </form>

+ Sniffers

+ Forms

+ Windows

+ 4x Browser

+ Images

+ Links

+ Frames

+ Clocks/Time

+ Misc.

Navigate

Home

Submit Script

Tutorials

Forums

Link To Us

Contact

Tell A Friend

Links

Bookmark Us