Сохранение элементов в форме html

У меня есть список из элементов. При выборе одного из них этот элемент остается в форме. Как можно добавить или удалить другие? Например выбираю Internet Explorer и он сохраняется в инпуте, потом Firefox, и он добавляется через запятую, а если нужно то удалить его из инпута.

<form action="/action_page.php" method="get">
  <input list="browsers" name="browser">
  <datalist id="browsers">
    <option value="Internet Explorer">
    <option value="Firefox">
    <option value="Chrome">
    <option value="Opera">
    <option value="Safari">
  </datalist>
  <input type="submit">
</form>

Как это реализовать?


Ответы (1 шт):

Автор решения: MarianD

Вместо

  <input list="browsers" name="browser">
  <datalist id="browsers">
    <option value="Internet Explorer">
    <option value="Firefox">
    <option value="Chrome">
    <option value="Opera">
    <option value="Safari">
  </datalist>

используйте

  <input type="checkbox" id="browser1" name="browser1" value="Internet Explorer">
  <label for="browser1"> Internet Explorer</label><br>
  <input type="checkbox" id="browser2" name="browser2" value="Firefox">
  <label for="vehicle2"> Firefox</label><br>
  <input type="checkbox" id="browser3" name="browser3" value="Chrome">
  <label for="browser3"> Chrome</label><br>
  <input type="checkbox" id="browser4" name="browser4" value="Opera">
  <label for="browser4"> Chrome</label><br>
  <input type="checkbox" id="browser5" name="browser5" value="Safari">
  <label for="browser5"> Chrome</label><br>
→ Ссылка