Jquery电台和文本框

Question

In my Jsp I have two radio buttons rb1 and rb2 and two text boxes txt1 and txt2...

How can I disable my text box txt2 whenever rb2 was checked?

Here is my code:

        <asp:TextBox runat="server" ID="txt1""></asp:TextBox>

        <asp:TextBox runat="server" ID="txt2"></asp:TextBox>

       <asp:RadioButton ID="rb1" Text="hello" runat="server" />

       <asp:RadioButton ID="rb2" Text="world" runat="server" />

Answer 1

You can use .change events from jQuery:

$("#<%= rb2.ClientID %>").change(function() {
    $("#<%= txt2.ClientID %>").prop("disabled", this.checked);
});

Answer 2

Bind it to the change event

$('[id*=rb2]').on('change', function() {
    var txt = $('[id*=txt2]');

    txt.prop('disabled', this.checked) : 
});

Also because the controls have runa=server attributes, make sure you use the attribute contains selector.

And don not forget to include the code inside DOM ready handler.

Answer 3

It would probably be best to use event delegation here.

$(document).on('change', '[id^="rb"]', function() {
    var txt = $("#txt" + event.target.id.split(/rb/)[1]);

    txt.prop('disabled', this.checked) : 
});

Anytime any of the radio buttons change, the corresponding input box will be found and disabled.