Удалить числа из запятой разделенной строки в JavaScript, если установлен флажок

Question

У меня есть несколько входов по типу чекбокса:

<input type="checkbox" value="5da1dc651d011c56ef1cb3db_693715"  onchange="handlechange(this)">
<input type="checkbox" value="6da1dc651d011c56ef1cb3db_123689"  onchange="handlechange(this)">

handlechange() функция собирается добавить значения проверенного ввода в

<input type="hidden" value="" class="GetVals" />

Основная проблема в том, что при проверкеfalse значение этого ввода должно быть удалено из <input type="hidden" value="" class="GetVals" />, но оно не будет удалено.

function handlechange(a) {
  var check = $(a).prop("checked");
  if (check == true) {
    var value = $(a).val();
    ids += value + ','

  } 
  else if (check == false) {
    var elements = ids.substring(0, ids.lastIndexOf(","))
    var element = elements.split(",");
  }
  $(".GetVals").val(ids)
}

Answer 1

Вы можете достичь результата с помощью некоторых встроенных методов.

Вы можете использовать .map() только на отмеченных флажках с .get() и join() следующим образом:

function handlechange() {
  var ids = $('input:checked').map((i, chk) => chk.value).get().join();
  $(".GetVals").val(ids)
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" value="5da1dc651d011c56ef1cb3db_693715"  onchange="handlechange(this)">
<input type="checkbox" value="6da1dc651d011c56ef1cb3db_123689"  onchange="handlechange(this)">

<input class="GetVals" style="width:500px;"/>

Answer 2

function handlechange() {
  var ids = [];
  $(".checkbox").each(function() {
    if ($(this).prop("checked")) {
      ids.push($(this).val());
    }
  });
  $(".GetVals").val(ids.join(","));
  $("#vals").text(ids.join(","));
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input class="checkbox" type="checkbox" value="5da1dc651d011c56ef1cb3db_693715" onchange="handlechange()">
<input class="checkbox" type="checkbox" value="6da1dc651d011c56ef1cb3db_123689" onchange="handlechange()">
<input type="hidden" value="" class="GetVals" />
<div id="vals"></div>

Вы можете использовать each для зацикливания checkbox, а затем join всех проверяемых значений.