Показать сообщение отдельно
  #5 (permalink)  
Старый 31.10.2019, 17:59
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Я не знаю каково назначение этих полей, а разместить данные можно по разному. Например, значение списка, как и значение полей не только для документа, но и для сервера. В этом случае поле value опций использовать нельзя. Здесь это свойство опций содержит идентификаторы сотрудников, а информация о них в data атрибутах и это объект, а далее как было написано выше:

<select name="employees">
    <option value="">Сотрудник ...</option>
    <option value="1" data-info='{"passport":"11 12 675677","organ":"Кукуевский ГОВД","data":"12.05.2000"}'>А. С. Сидоров</option>
    <option value="2" data-info='{"passport":"18 22 970734","organ":"Гадюкинский ГОВД","data":"22.09.1989"}'>В. П. Петров</option>
</select>
<input name="passport" />
<input name="organ" />
<input name="data" />
<script>
document.querySelector('[name="employees"]').addEventListener('change', function() {
    var d = JSON.parse(this.options[this.selectedIndex].dataset.info);
    if(this.value) for(var k in d) document.querySelector('[name="'+k+'"]').value = d[k]
})
</script>


Если список не выполняет такой роли, то данные можно помещать и свойство value опций, что облегчает их получение:

<select id="employees">
    <option value="">Сотрудник ...</option>
    <option value='{"passport":"11 12 675677","organ":"Кукуевский ГОВД","data":"12.05.2000"}'>А. С. Сидоров</option>
    <option value='{"passport":"18 22 970734","organ":"Гадюкинский ГОВД","data":"22.09.1989"}'>В. П. Петров</option>
</select>

<input name="passport" />
<input name="organ" />
<input name="data" />
<script>
document.querySelector('#employees').addEventListener('change', function() {
    var d = JSON.parse(this.value);
    if(this.value) for(var k in d) document.querySelector('[name="'+k+'"]').value = d[k]
})
</script>


Можно хранить данные и как массив или просто строки из которой получать массив, и помещая их по индексу в наборе полей:

<select id="employees">
    <option value="">Сотрудник ...</option>
    <option value="11 12 675677,Кукуевский ГОВД,12.05.2000">А. С. Сидоров</option>
    <option value="18 22 970734,Гадюкинский ГОВД,22.09.1989">В. П. Петров</option>
</select>
<div id="pass">
    <input />
    <input />
    <input />
</div>
<script>
document.querySelector('#employees').addEventListener('change', function() {
    var f = document.querySelector('#pass').querySelectorAll('input');
    if(this.value) this.value.split(',').forEach((v, i) => f[i].value = v) 
})
</script>


В общем способов решений много.
Ответить с цитированием