Question

i want to validate input for a radio group named A,with 2 radios: 1 and 2.
Once radio 2 is checked, i want textbox B to be enabled (default is disabled).
My JavaScript is very weak. Somebody help me with the following code? This is so far i can go:

<script type="text/javascript">
$(document).ready(function() {
    $("#form").validate({
        rules: {
            A: "required",
        }
    });  
});
</script>

<form id="form" name="form" method="post" action="">
<table><tr>
<td width><input type="radio" name="A" id="1" value="1" />1</td>
<td width><input type="radio" name="A" id="2" value="2" />2</td>
</tr></table>
</form>

<input name="B" type="text" id="B" disabled="disabled"/>

I want the message “This field is required.” to be displayed in a row below the radio group:

<tr><td colspan="2">This field is required.</tr></td>

Please help.Thanks.

Answer 1

Something in the line of:

​$(':radio').change(function() {
    $('#B').prop('disabled', !(this.value == '2' && this.checked));
})​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​;

Demo: http://jsfiddle.net/5PMLr/

Sidenote: You should have more than one char for IDs and don’t start with a number.