disable textbox using jquery?
I have three radio buttons with same name and different values.When I click the third radio button the checkbox and textbox going to be disabled.but when I choose other two radio buttons it must be show.I need the help in Jquery.Thanks in advance....
<form name="checkuserradio">
<input type="radio" value="1" name="userradiobtn" id="userradiobtn"/>
<input type="radio" value="2" name="userradiobtn" id="userradiobtn"/>
<input type="radio" value="3" name="userradiobtn" id="userradiobtn"/>
<input type="checkbox" value="4" name="chkbox" />
<input type="text" name="usertxtbox" id="usertxtbox" />
</form>
HTML
<span id="radiobutt">
<input type="radio" name="rad1" value="1" />
<input type="radio" name="rad1" value="2" />
<input type="radio" name="rad1" value="3" />
</span>
<div>
<input type="text" id="textbox1" />
<input type="checkbox" id="checkbox1" />
</div>
Javascript
$("#radiobutt input[type=radio]").each(function(i){
$(this).click(function () {
if(i==2) { //3rd radiobutton
$("#textbox1").attr("disabled", "disabled");
$("#checkbox1").attr("disabled", "disabled");
}
else {
$("#textbox1").removeAttr("disabled");
$("#checkbox1").removeAttr("disabled");
}
});
});
Not really necessary, but a small improvement to o.k.w.'s code that would make the function call faster (since you're moving the conditional outside the function call).
$("#radiobutt input[type=radio]").each(function(i) {
if (i == 2) { //3rd radiobutton
$(this).click(function () {
$("#textbox1").attr("disabled", "disabled");
$("#checkbox1").attr("disabled", "disabled");
});
} else {
$(this).click(function () {
$("#textbox1").removeAttr("disabled");
$("#checkbox1").removeAttr("disabled");
});
}
});