mardi 3 avril 2018

jquery toggle other checkbox if a user clicks on one checkbox

I have two checkboxes "obsolete" and "pending". If a user clicks on one of the two checkboxes, then the other checkbox should be disabled. If the user unselect one checkbox then both of the checkboxes should be selectable.

My HTML:

<div>
  <input name="job[invoice_sent]" type="hidden" value="0"><input type="checkbox" value="1" name="job[invoice_sent]" id="job_invoice_sent"> 
  obsolete
  <input name="job[invoice_sent]" type="hidden" value="0"><input type="checkbox" value="1" name="job[invoice_sent]" id="job_invoice_sent"> 
  pending 
</div>

My attempt:

$(document).ready(function(){
  $("input.obsolete").click(toggle_checkbox());
  $("input.pending").click(toggle_checkbox());
});

function toggle_checkbox() {
  if($('input.obsolete').checked) {
    $("input.pending").attr("disabled", true);
  } else {
    $("input.pending").removeAttr("disabled");
  };

  if($('input.pending').checked) {
    $("input.obsolete").attr("disabled", true);
  }  else {
    $("input.obsolete").removeAttr("disabled");
  };
}

But I still can click on both checkboxes. What am I missing?




Aucun commentaire:

Enregistrer un commentaire