Javascript >> checkbox >> Lock the CheckBoxes

Lock,disable the CheckBoxes
Some times you don't want the users to select the ckeckbox. You can do this by Disabling the check box. Disabling a checkbox means that the checkbox is grayed out .

To disable a checkbox, add the line DISABLED to the <type="checkbox" name="c1" value="check me 1" > tag so the final result looks like .

The following example shows how to lock and unlock the check box on some conditions.You can do this by calling a javascript function on onclick() event.

Lock checkbox2
Lock checkbox1
Unlock all checkboxes

Copy and paste the following code.

<form name=exf1>
<input type="checkbox" name="c2" value="check me 2" onclick=doIt(2)> Lock checkbox2
<input type=hidden name=h2 value=0>
<input type="checkbox" name="c3" value="check me 3" onclick=doIt(3)> Lock checkbox1
<input type=hidden name=h3 value=0>
<input type="checkbox" name="c1" value="check me 1" onclick=doIt(1)> Unlock all checkboxes
<input type=hidden name=h1 value=0>
</form>
<script language=JavaScript> var U=0;L=1; // (U)nlocked & (L)ocked
function doIt(_v)
{
if(eval("document.exf1.c"+_v+".checked"))
{
if(_v==1){unlock(2);unlock(3);}
if(_v==2){lock(3);}
if(_v==3){lock(2);}
}
else
{
if(_v==1){whipe(2);whipe(3);unlock(2);unlock(3);}
if(_v==2){unlock(3);}
if(_v==3){unlock(2);}
}
}
function lock(_v)
{
eval("document.exf1.c"+_v+".disabled=true"); // IE thing
eval("document.exf1.h"+_v+".value=L");
}
function unlock(_v)
{
eval("document.exf1.c"+_v+".disabled=false"); // IE thing
eval("document.exf1.h"+_v+".value=U");
}
function whipe(_v)
{
eval("document.exf1.c"+_v+".checked=false");
}

</script>

Page contents: itechies.net - Learn how to Lock/unlock the CheckBoxes using javascript