Remove specific characters from string jquery [duplicate]

Question

OK, So although it seems normal substring or replaces solution answer it is quite complex for me.

I have 3 checkboxes A,B,C and one text box Now, when user select any checkbox the value of checkbox appends into textbox i.e. Fist he selects A -> textbox will be appended by A Then if selects B -> textbox value will be A, B and so on.

i have done it already. Now the problem is for unchecking.

If the value of textbox is A,B,C i.e. the selected checkboxes are A,B,C and if user deselects the B then the value should be A,C and then again deselects the c then the value should be A.

I have tried multiple ways but don't work for all conditions, sometimes it becomes A, C or A, B

Any solution? Thank you in advance :)

Answer 1

You can simply recreate the list on change of a box

let els = [...document.getElementsByClassName('check')];
els.forEach(e => e.addEventListener('change', () => {
  document.getElementById('foo').value = els.filter(x => x.checked).map(x => x.value).join();
}))

.flex {
  display: flex;
  flex-direction: column;
}

<div class="flex">
  <input id="foo" />
  <label><input type="checkbox" class="check" value="A"/>A</label>
  <label><input type="checkbox" class="check" value="B"/>B</label>
  <label><input type="checkbox" class="check" value="C"/>C</label>
</div>