Include input fields if radio windows are marked with jquery

I have radio buttons in the HTML code:

<span><input type="radio" value="false" name="item[shipping]" id="item_shipping_false" checked="checked"><label for="item_shipping_false" class="collection_radio_buttons">No</label></span>

<span><input type="radio" value="true" name="item[shipping]" id="item_shipping_true"><label for="item_shipping_true" class="collection_radio_buttons">Yes</label></span>

and I have 1 disabled field, for example:

<input id="item_shipping_cost" class="currency optional" type="text" size="30" name="item[shipping_cost]" disabled="disabled">

I want if the user clicks the Yes option in the radio buttons, remove the html attribute disabled="disabled"in this last input field, and if the user clicks the No in radio buttons option, add the attribute disabled="disabled"to this last input field

How can I do this using jquery?

Thank you!

+5
source share
4 answers

you can use removeAttr

   $('#item_shipping_true').click(function()
{
  $('#item_shipping_cost').removeAttr("disabled");
});

$('#item_shipping_false').click(function()
{
  $('#item_shipping_cost').attr("disabled","disabled");
});

see demo in JsFiddle

+7
source
$('input[name="item[shipping]"]').on('click', function() {
   if ($(this).val() === 'true') {
      $('#item_shipping_cost').removeProp("disabled");
   }
   else {
      $('#item_shipping_cost').prop("disabled", "disabled");
   }
});
+3
source

JavaScript :

   $('#item_shipping_false').change(function() {
      $('#item_shipping_cost').prop('disabled', false);
    });
    $('#item_shipping_true').change(function() {
      $('#item_shipping_cost').prop('disabled', true);
    });

.

+2

DEMO

. ,
0

All Articles