Home > Software design >  jQuery value includes any of array
jQuery value includes any of array

Time:10-01

I updated the question as per a helpful answer, that brought me closer, but sadly did not quite achieve what I needed.

UPDATE:

I am trying to create a jQuery function that will disable any checkboxes with a value that matches any part of the currently checked checkbox's value.

$(document).ready(function() {
  $('input[id^="takaritas"]').click(function() {
    if ($("#kategoria").val() == "") {
      $('input[id^="takaritas"]').prop("checked", false);
      $('input[id^="takaritas"]').val("");
      alert("Válasszon autó kategóriát!");
    } else if ($("#takaritasnincs").is(":checked")) {
      $('input[id^="takaritas"]').not(this).attr("disabled", "disabled");
      $('input[id^="takaritas"]').not(this).prop("checked", false);
      $('input[id^="takaritaskoltseg"]').val("");
    } else if ($(this).not("#takaritasnincs").is(":checked")) {

      let array = $(this).val().split(" ");
      array.forEach((el, index) => {
        array[index] = array[index].replace("mosás", "").replace("Polír", "");
      });
      const filteredArray = array.filter((x) => x !== " ");
      filteredArray.forEach((el) => {

        let input = document.querySelector('[value="'   el   '"]');
        if (input) {
          document.querySelector(
            'input[type="checkbox"][value="'   el   '"]'
          ).disabled = true;
          document.querySelector(
            'input[type="checkbox"][value="'   el   '"]'
          ).checked = false;
        }
      });
    } else {
      $('input[id^="takaritas"]').removeAttr("disabled");
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="takaritas-inline">
<input type="checkbox" id="takaritasnincs" name="takaritasnincs" value="nincs">nincs</label>
<br>

<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas1' onclick='takaritasKalk(this, 0)' value='Külső mosás'>Külső mosás</label>
<br>

<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas2' onclick='takaritasKalk(this, 1)' value='Belső mosás'>Belső mosás</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas3' onclick='takaritasKalk(this, 2)' value='Külső   Belső mosás'>Külső   Belső mosás</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas4' onclick='takaritasKalk(this, 3)' value='Külső   Belső   Wax   Motormosás'>Külső   Belső   Wax   Motormosás</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas5' onclick='takaritasKalk(this, 4)' value='Polír'>Polír</label>
<br>


<label class='takaritas-inline'><input type='checkbox' name='takaritas[]' id='takaritas6' onclick='takaritasKalk(this, 5)' value='Kárpit'>Kárpit</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas7' onclick='takaritasKalk(this, 6)' value='Kárpit   Wax'>Kárpit   Wax</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas8' onclick='takaritasKalk(this, 7)' value='Lámpa Polír'>Lámpa Polír</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas9' onclick='takaritasKalk(this, 8)' value='Komplett (polír kárpit)'>Komplett (polír kárpit)</label>

Clicking a checkbox with "Külső Belső Wax Motormosás" as the value returns me this array:

["Külső", " ", "Belső", " ", "Wax", " ", "Motormosás"]

I need the function to disable any checkbox that includes any part of that array, ignoring the plus signs and the partial strings "mosás" and "polír".

Any help would be highly appreciated.

CodePudding user response:

You can filter the array then disabled it if exist like:

let array = ["Külső", " ", "Belső", " ", "Wax", " ", "Motormosás"];
array.forEach((el, index) => {
  array[index] = array[index].replace('mosás', '');
});
const filteredArray = array.filter(x => x !== ' ');
filteredArray.forEach(el => {
  let input = document.querySelector('[value="'   el   '"]');
  if (input) {
    input.disabled = true;
  }
});
<div>
  <input type="checkbox" id="Wax" name="test" value="Wax">
  <label for="Wax">Wax</label>
</div>

<div>
  <input type="checkbox" id="Belso" name="test2" value="Belső">
  <label for="Belso">Belső</label>
</div>

<div>
  <input type="checkbox" id="testvaluenodisable" name="test3" value="testvaluenodisable">
  <label for="testvaluenodisable">testvaluenodisable</label>
</div>


Edit after update: You need to use querySelectorAll with wildcard *= for match all values have one element of array, then foreach that and disable it.

function takaritasKalk(element, number) {
  let array = element.value.split(' ');
  array.forEach((el, index) => {
    array[index] = array[index].replace('mosás', '');
  });
  const filteredArray = array.filter(x => x !== ' ');
  filteredArray.forEach(el => {
    let input = document.querySelectorAll('input[type="checkbox"][value*="'   el   '"]');
    if (input[0]) {
      input.forEach(inputFinal => {
        if (inputFinal.id !== element.id) {
          if (!element.checked) {
            inputFinal.disabled = false;
          } else {
            inputFinal.disabled = true;
          }
        }
      });
    }
  });
}
<label class="takaritas-inline">
<input type="checkbox" id="takaritasnincs" name="takaritasnincs" value="nincs">nincs</label>
<br>

<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas1' onclick='takaritasKalk(this, 0)' value='Külső mosás'>Külső mosás</label>
<br>

<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas2' onclick='takaritasKalk(this, 1)' value='Belső mosás'>Belső mosás</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas3' onclick='takaritasKalk(this, 2)' value='Külső   Belső mosás'>Külső   Belső mosás</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas4' onclick='takaritasKalk(this, 3)' value='Külső   Belső   Wax   Motormosás'>Külső   Belső   Wax   Motormosás</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas5' onclick='takaritasKalk(this, 4)' value='Polír'>Polír</label>
<br>


<label class='takaritas-inline'><input type='checkbox' name='takaritas[]' id='takaritas6' onclick='takaritasKalk(this, 5)' value='Kárpit'>Kárpit</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas7' onclick='takaritasKalk(this, 6)' value='Kárpit   Wax'>Kárpit   Wax</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas8' onclick='takaritasKalk(this, 7)' value='Lámpa Polír'>Lámpa Polír</label>
<br>


<label class='takaritas-inline'>
<input type='checkbox' name='takaritas[]' id='takaritas9' onclick='takaritasKalk(this, 8)' value='Komplett (polír kárpit)'>Komplett (polír kárpit)</label>

  • Related