What is the best way to disable an input with a radio button via jQuery?

Question

Hallo all. I got this piece of code:

<div>
    <input id="id1" name="radioButton" type="radio">
    <input type="text" id="idText1">
    <p></p>
    <input id="id2" name="radioButton" type="radio">
    <input type="text" id="idText2">

</div>

When I select the radio id1 I need to disable idText2 and when I select radio id2 I need to disable idText1. Is there an elegant way?

Kind regards Massimo

Answer 1

I suppose that you want to enable the textbox next to the radio button also?

$(function(){
  $('#id1, #id2').click(function(){
    $('#idText1')[0].disabled = (this.id != 'id1');
    $('#idText2')[0].disabled = (this.id != 'id2');
  });
});

You might want to start with one radio button checked and the other textbox disabled:

<div>
  <input id="id1" name="radioButton" type="radio" checked>
  <input type="text" id="idText1">
  <p></p>
  <input id="id2" name="radioButton" type="radio">
  <input type="text" id="idText2" disabled>
</div>

Answer 2

and a one liner for some fun :) ( well besides the wrapping.. )

$('div :radio').click(function(){
   $(this).siblings(':text').attr('disabled','disabled').end().next(':text').removeAttr('disabled');
})