Как мы добавляем или удаляем атрибут readonly из текстового поля при нажатии кнопки radion в cakephp с помощью jquery?

Вот мой фреймворк HTML и . script:

<input type="radio" id="need_staff_on_site" name="data[CaterRequest][need_staff_on_site]" value="yes" class="staff_on_site"><span>Yes</span>

<input type="radio" id="need_staff_on_site" name="data[CaterRequest][need_staff_on_site]" class="staff_on_site" value="no"><span>No</span>

How many staff?<input type="text" maxlength="3" id="no_of_staff" name="data[CaterRequest][staff_needed]" class="txtboxSml2" readonly="readonly">

jquery script:

$(document).ready(function(){
   $('.staff_on_site').click(function(){
   $arr=$(this).val();
   if($arr == "yes"){ $("#no_of_staff").removeAttr("readonly"); }
   if($arr == "no"){ $("#no_of_staff").attr("readonly", "readonly"); }
  });
});

Демо-ссылка jsfiddle

Ответы

Ответ 1

В вашем случае вы можете написать следующий код jquery:

$(document).ready(function(){

   $('.staff_on_site').click(function(){

     var rBtnVal = $(this).val();

     if(rBtnVal == "yes"){
         $("#no_of_staff").attr("readonly", false); 
     }
     else{ 
         $("#no_of_staff").attr("readonly", true); 
     }
   });
});

Вот сценарий: http://jsfiddle.net/P4QWx/3/

Ответ 2

Вы также можете использовать prop. Проверьте следующий код ниже.

$(document).ready(function(){

   $('.staff_on_site').click(function(){

     var rBtnVal = $(this).val();

     if(rBtnVal == "yes"){
         $("#no_of_staff").prop("readonly", false); 
     }
     else{ 
         $("#no_of_staff").prop("readonly", true); 
     }
   });
});

Ответ 3

Проверьте это решение, используя jquery:

   $(document).ready(function () {
                $('.staff_on_site').click(function () {
                    var rBtnVal = $(this).val();
                    if (rBtnVal == "yes") {
                        $("#no_of_staff").removeAttr("readonly");
                    }
                    else {
                        $("#no_of_staff").attr("readonly", "readonly");
                    }
                });
            });