Activar INPUTS

activar inputs segun selección

by Raúl Rojas

HTML

<form>
  <input type="checkbox" name="fooby[1][]" id="si"> SI
  <input type="checkbox" name="fooby[1][]" id="no"> NO

  <input type="checkbox" name="fooby[2][]" class="group1">
  <input type="checkbox" name="fooby[2][]" class="group1">
  <input type="checkbox" name="fooby[2][]" class="group1">
</form>

JavaScript

$(function() {
  enable_cb();
  $("#si").click(enable_cb);
});
$(function() {
  disable_cb();
  $("#no").click(disable_cb);
});

function enable_cb() {
  if (this.checked) {
    $("input.group1").removeAttr("disabled");
  } else {
    $("input.group1").attr("disabled", true);
  }
}

function disable_cb() {
  if (this.checked) {

    $("input.group1").attr("disabled", true);
  }
}



// the selector will match all input controls of type :checkbox
// and attach a click event handler 
$("input:checkbox").on('click', function() {
  // in the handler, 'this' refers to the box clicked on
  var $box = $(this);
  if ($box.is(":checked")) {
    // the name of the box is retrieved using the .attr() method
    // as it is assumed and expected to be immutable
    var group = "input:checkbox[name='" + $box.attr("name") + "']";
    // the checked state of the group/box on the other hand will change
    // and the current value is retrieved using .prop() method
    $(group).prop("checked", false);
    $box.prop("checked", true);
  } else {
    $box.prop("checked", false);
  }
});