mardi 3 mai 2016

Get IDs of all unchecked checkboxes using jQuery

My main goal is to post "0" when a checkbox is unchecked. I have come across a technique where I need to put a hidden field that has the same name as with my checkbox. Once a checkbox is checked, the hidden field is disabled. It works wonder for me, however, the code seems to be so long and I wanted to look a way to shorten this up.

HTML:

<div id="subscriptionForm">
  <input type="checkbox" value="1" class="checkLeft" name="checkLeft1" id="checkLeft1" />
  <input type="hidden" value="0" name="checkLeft1" id="checkLeft1Hidden" />
  <input type="checkbox" value="1" class="checkLeft" name="checkLeft2" id="checkLeft2"/>
  <input type="hidden" value="0" name="checkLeft2" id="checkLeft2Hidden" />

  <input type="checkbox" value="1" class="checkRight" name="checkRight1" id="checkRight1"/>
  <input type="hidden" value="0" name="checkRight1" id="checkRight1Hidden" />
  <input type="checkbox" value="1" class="checkRight" name="checkRight2" id="checkRight2"/>
  <input type="hidden" value="0" name="checkRight2" id="checkRigh21Hidden" />
</div>

Script:

function disableHidden() {
  if ($("#checkLeft1").is(":checked")) {
    $("#check1Hidden").attr("disabled", true);
  }
  if ($("#checkLeft2").is(":checked")) {
    $("#check2Hidden").attr("disabled", true);
  }
  if ($("#checkRight1").is(":checked")) {
    $("#trAsiaEuropeHidden").attr("disabled", true);
  }
  if ($("#checkRight2").is(":checked")) {
    $("#trAsiaNamHidden").attr("disabled", true);
  }
}

I had to put different classes on left and right so as to follow the desired layout.

Do you have some suggestion on this? Thank you!




Aucun commentaire:

Enregistrer un commentaire