Radio buttons Enable/Disable textboxes

Hi,  I have a asp.net webform with four radio buttons and four associated textboxes.   OnLoad the first radio button and textbox are enabled.  

What I'd like to be able to do is this....  

When a user select another radio button, the textbox associated with that radio button (found in the same row) is enabled and all other textboxes are disabled?  Can you please provide me a JQuery or JavaScript code that will achieve this functionality?

My Table, radio buttons and textboxes are below.  THANKS!

<table>
                <tr>
                    <td>
                        <asp:RadioButton ID="rbtnSpecNumber" runat="server" Text="Spec #" Checked="True" />
                    </td>
                    <td>
                        <asp:TextBox ID="tbSpecNumber" runat="server" Enabled="True"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:RadioButton ID="rbtnClient" runat="server" Text="Client" />
                    </td>
                    <td>
                        <asp:TextBox ID="tbClient" runat="server" Enabled="false"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:RadioButton ID="rbtnShow" runat="server" Text="Show"/>
                    </td>
                    <td>
                        <asp:TextBox ID="tbShow" runat="server" Enabled="false"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:RadioButton ID="rbtnAccountExec" runat="server" Text="Account Exec"/>
                    </td>
                    <td>
                        <asp:TextBox ID="tbAccountExec" runat="server" Enabled="false"></asp:TextBox>
                    </td>
                </tr>
            </table>

Open in new window

cdemott33Asked:
Who is Participating?
 
Rainer JeschorCommented:
Hi,
something like this?
$(document).ready(function () {
    $("input:radio").click(function(){
        var $table = $(this).closest("table");
        $("input:text", $table).prop( "disabled", true );
        $("input:radio",$table).prop("checked","");
        $(this).prop("checked","checked");
        $(this).closest("tr").find("input:text").prop("disabled", false);
    });
});

Open in new window

Live (plain HTML) sample:
http://jsfiddle.net/EE_RainerJ/70ekhavt/
HTH
Rainer
0
 
cdemott33Author Commented:
Works PERFECTLY!  Thanks Rainer!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.