как выбранный select multiple option вписать в input? PHP

Question

как выбранный select multiple option вписать в input?

Есть код:

                                    <div class="col-12 col-lg-6">
                                    <select class="js-example-basic-multiple" id="genre" multiple="multiple" name="genre[]" onchange="document.getElementById('inphid').value=value">
                                        <option value="Боевик">Боевик</option>
                                        <option value="Драма">Драма</option>
                                        <option value="Детектив">Детектив</option>
                                        <option value="Комедия">Комедия</option>
                                        <option value="Криминал">Криминал</option>
                                        <option value="Мелодрама">Мелодрама</option>
                                        <option value="Мультфильм">Мультфильм</option>
                                        <option value="На реальных событиях">На реальных событиях</option>
                                        <option value="Приключения">Приключения</option>
                                        <option value="Триллер">Триллер</option>
                                        <option value="Ужасы">Ужасы</option>
                                        <option value="Фантастика">Фантастика</option>
                                    </select>
                                </div>
                                <input id="inphid" val="" type="text" />

Как передать выбранные значения option value в Input? Передаётся только лишь одно значение, как исправить?

Answer 1

document.getElementById('genre').addEventListener('change', setGenre);

function setGenre() {
  // берём все option:checked в массив ([...])
  // по массиву проходимся исп. map метод, оставляя только value каждой option
  // исп. join массив значений склеиваем в строку 
  let genres = [...this.querySelectorAll('option:checked')].map((e)=>e.value).join(", ");
  // ставим строку с жанрами в input
  document.getElementById('inphid').value = genres;
}

<div class="col-12 col-lg-6">
  <select class="js-example-basic-multiple" id="genre" multiple="multiple" name="genre[]">
    <option value="Боевик">Боевик</option>
    <option value="Драма">Драма</option>
    <option value="Детектив">Детектив</option>
    <option value="Комедия">Комедия</option>
    <option value="Криминал">Криминал</option>
    <option value="Мелодрама">Мелодрама</option>
    <option value="Мультфильм">Мультфильм</option>
    <option value="На реальных событиях">На реальных событиях</option>
    <option value="Приключения">Приключения</option>
    <option value="Триллер">Триллер</option>
    <option value="Ужасы">Ужасы</option>
    <option value="Фантастика">Фантастика</option>
  </select>
</div>
<input id="inphid" val="" type="text" />

БЛОГ НА HUSL

как выбранный select multiple option вписать в input? PHP

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