CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user2456861
user2456861

Reputation: 53

Jquery Radio and text boxes

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" />

Upvotes: 1

Views: 137

Answers (3)

jcreamer898
jcreamer898

Reputation: 8189

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.

Upvotes: 0

Sushanth --
Sushanth --

Reputation: 55740

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.

Upvotes: 2

tymeJV
tymeJV

Reputation: 104775

You can use .change events from jQuery:

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

Upvotes: 2

Related Questions