Как в один input отправить несколько значений с select?

Question

[Michaly4]

Ребята приветствую подскажите,...или либо где подсмотреть, как с разных select с которых я стягую value и отправляю в один input.value чтобы они не перезаписывались а следовали последовательно??
Т.е.к примеру с select option.value ="New"...
Второй select. option.value = 'York"...
На выходе в input.value должно быть = "New York "...ну у меня перезаписуется ,и я не знаю как это сделать??может у кого время есть быстро накидать реализацию??))

Comments

[ThunderCat]

у меня перезаписуется

Понятное дело, вы же его перезаписываете, а должны добавлять...

я не знаю как это сделать

Как добавить одно значение к другому не знаете???

[Michaly4]

ThunderCat и как добавлять?)

[ThunderCat]

Michaly4, взять старое значение из инпута, добавить новое, вставить... Если селектов много - собрать при каждом изменении со всех и объединить... Нельзя же так тупить то...

Answer 1

[0xD34F]

О каких select'ах идёт речь, какому input'у и как надо обновить значение:

const container = document.querySelector('селектор контейнера с select\'ами');
const selectSelector = 'селектор select\'ов';
const input = document.querySelector('селектор input\'а');
const updateInput = selects => input.value = Array.from(selects, n => n.value).join(' ');

Слушаем у select'ов событие change, вот собственно и всё:

container.addEventListener('change', function() {
  updateInput(this.querySelectorAll(selectSelector));
});

// или

const selects = container.querySelectorAll(selectSelector);
const onChange = updateInput.bind(null, selects);
selects.forEach(n => n.addEventListener('change', onChange));

Comments

[Michaly4]

Спасибо всё работает!!Но мне ещё многое не знакомо с этого кода,буду разбираться!!!