30.09.2022, 09:41
|
 |
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,135
|
|
|
Сообщение от Marts
|
|
Мне надо создать отдельный файл, и что-то в него вписать?
|
строки 2 - 6 перенести в например arr.js, и тогда вместо строк 1 - 7 будет
<script src="arr.js"></script>
|
|
30.09.2022, 09:56
|
 |
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,236
|
|
|
Сообщение от Marts
|
|
а что вы имеете ввиду под словами "вынести в отдельный файл" Мне надо создать отдельный файл, и что-то в него вписать?
|
В общем смысле мое слово "файл" можно заменить на коллекцию (MongoDB) или таблицу (SQL-ные СУБД)...
Т.е. все будет определяться твоими возможностями. |
|
30.09.2022, 10:43
|
 |
Новичок на форуме
|
|
Регистрация: 30.09.2022
Сообщений: 8
|
|
Я до конца оформил мысль свою в моём прошлом сообщении, можете подсобить ?
Или мне надо 2й .js создать и дублировать туда данные для второй формы на одной странице?(Хотя попробовал, так тоже не работает)
Для второй формы просто уже к селекту совершенно другой id подписал как "ars" которого нету ни где, но Данные подставляет из client.js в первую форму.
<ul class="list list--mod">
<li class="list-item">
<span class="list-span">ФИО</span>
<input type="text" name="fio2" data-number="0" class="input input_surname2" size="25">
</li>
<!--
<li class="list-item">
<span class="list-span">Имя</span>
<input type="text" data-number="0" class="input input_name2">
</li>
<li class="list-item">
<span class="list-span">Отчество</span>
<input type="text" data-number="0" class="input input_patronymic2">
</li>
-->
<li class="list-item">
<span class="list-span">Вид ТС</span>
<input type="text" name="auto2" data-number="0" class="input input_view2">
</li>
<li class="list-item">
<span class="list-span">С/№ паспорта</span>
<input type="text" name="passport2" data-number="0" class="input input_passport2">
</li>
<li class="list-item">
<span class="list-span">Компания</span>
<input type="text" name="organ2" data-number="0" class="input input_company2">
</li>
<li class="list-item">
<span class="list-span">Число</span>
<script>
var d = new Date();
document.write('<input type="text" data-number="1" class="input input_top input-date input_date2" value="' + d.getDate() + '" >');
</script>
<span class="list-span">Месяц</span>
<script>
document.write('<input type="text" data-number="1" class="input input_top input-month input_month2" value="' + month[d.getMonth()] + '" >');
</script>
<!-- <input type="text" data-number="0" class="input input-month input_month2" value="июня"> -->
</li>
</ul>
<button type="button" class="btn btn-default btn_bottom">Напечатать 2 бланка</button> <select id="ars">
<option>Клиент ...</option>
<option>Сидоренко С.С</option>
<option>Пономаренко П.П</option>
</select>
<script>
document.querySelector('#ars').addEventListener('change', function() {
var d = arr[this.selectedIndex];
for(var k in d) document.querySelector('[name="'+k+'"]').value = d[k];
})
</script>
А вот отрезок от первой формы
<ul class="list">
<li class="list-item">
<span class="list-span">ФИО</span>
<input type="text" name="fio" autocomplete="on" data-number="1" class="input input_top input_surname1" value=""
size="25">
</li>
<!--
<li class="list-item">
<span class="list-span">Имя</span>
<input type="text" autocomplete="on" data-number="1" class="input input_top input_name1" value="">
</li>
<li class="list-item">
<span class="list-span">Отчество</span>
<input type="text" autocomplete="on" data-number="1" class="input input_top input_patronymic1" value="">
</li>
-->
<li class="list-item">
<span class="list-span">Вид ТС</span>
<input type="text" name="auto" autocomplete="on" data-number="1" class="input input_top input_view1" value="">
</li>
<li class="list-item">
<span class="list-span">С/№ паспорта</span>
<input type="text" name="passport" autocomplete="on" data-number="1" class="input input_top input_passport1"
value="">
</li>
</li class="list-item">
<span class="list-span">Компания</span>
<input type="text" name="organ" autocomplete="on" data-number="1" class="input input_top input_company1" value="">
</li>
<li class="list-item">
<span class="list-span">Число</span>
<script>
var d = new Date();
var month = ['Января', 'Февраля', 'Марта', 'Апреля', 'Мая', 'Июня', 'Июля', 'Августа', 'Сентября', 'Октября', 'Ноября', 'Декабря'];
document.write('<input type="text" data-number="1" class="input input_top input-date input_date1" value="' + d.getDate() + '" >');
</script>
<span class="list-span">Месяц</span>
<script>
document.write('<input type="text" data-number="1" class="input input_top input-month input_month1" value="' + month[d.getMonth()] + '" >');
</script>
<!-- <input type="text" data-number="1" class="input input_top input-month input_month1" value="Июль"> -->
</li>
</ul>
<button type="button" class="btn btn-default btn_top">Напечатать 1 бланк</button> <select id="client">
<option>Клиент ...</option>
<option>Сидоренко С.С</option>
<option>Пономаренко П.П</option>
</select>
<script>
document.querySelector('#client').addEventListener('change', function() {
var d = arr[this.selectedIndex];
for(var k in d) document.querySelector('[name="'+k+'"]').value = d[k];
})
</script>
Последний раз редактировалось Marts, 30.09.2022 в 13:00.
|
|
30.09.2022, 12:51
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,236
|
|
|
Сообщение от Marts
|
|
Для первой формы я справился и подключил ваш пример! А как подключить ещё ко второй?
|
Вариант для двух "форм"...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!--
<script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
-->
<style>
</style>
<script>
document.addEventListener('DOMContentLoaded', _ => {
const arr = [
{passport: "", organ: "", data:""},
{passport: "11 12 675677", organ: "Кукуевский ГОВД", data: "12.05.2000"},
{passport: "18 22 970734", organ: "Гадюкинский ГОВД", data: "22.09.1989"}
];
document.querySelectorAll('.employees').forEach(el => {
el.addEventListener('change', function() {
const d = arr[this.selectedIndex];
const o = el.closest('div')
for(var k in d) o.querySelector('[name="'+k+'"]').value = d[k];
})
})
})
/*
$(_ => {
})
*/
</script>
</head>
<body>
<div>
<select class="employees">
<option>Сотрудник ...</option>
<option>А. С. Сидоров</option>
<option>В. П. Петров</option>
</select>
<input name="passport" />
<input name="organ" />
<input name="data" />
</div>
<div>
<select class="employees">
<option>Сотрудник ...</option>
<option>А. С. Сидоров</option>
<option>В. П. Петров</option>
</select>
<input name="passport" />
<input name="organ" />
<input name="data" />
</div>
</body>
</html>
Последний раз редактировалось ksa, 30.09.2022 в 12:57.
|
|
30.09.2022, 13:11
|
|
Новичок на форуме
|
|
Регистрация: 30.09.2022
Сообщений: 8
|
|
|
Щас буду что-то пробовать! Надеюсь что нибудь у меня выйдет ^_^
|
|
30.09.2022, 13:56
|
|
Новичок на форуме
|
|
Регистрация: 30.09.2022
Сообщений: 8
|
|
А можете растолкововать немного? Что я делаю не так? (вообще по разному пытался)
Я так делаю?
Создал "Файл DOMContentLoaded.js" и поместил туда
document.addEventListener('DOMContentLoaded', _ => {
const arr = [
{passport: "", organ: "", data:"", fio:""},
{passport: "11 12 675677", organ: "Кукуевский ГОВД", data: "12.05.2000", fio: "А. С. Сидоров"},
{passport: "18 22 970734", organ: "Гадюкинский ГОВД", data: "22.09.1989", fio: "В. П. Петров"}
];
document.querySelectorAll('.employees').forEach(el => {
el.addEventListener('change', function() {
const d = arr[this.selectedIndex];
const o = el.closest('div')
for(var k in d) o.querySelector('[name="'+k+'"]').value = d[k];
})
})
})
/*
$(_ => {
})
*/
Добавил в html выпадающие списки (пока только к одной форме добавил)
<div>
<select class="employees">
<option>Сотрудник ...</option>
<option>А. С. Сидоров</option>
<option>В. П. Петров</option>
</select>
</div>
К каждой из своих форм в input добавил
name="passport"
name="organ"
name="data"
name="fio"
Просто чёт пока не выходит у меня ни чего вообще) Думаю думаю
Последний раз редактировалось Marts, 30.09.2022 в 14:04.
|
|
30.09.2022, 14:09
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,135
|
|
|
Сообщение от Marts
|
|
Что я делаю не так?
|
|
Сообщение от Marts
|
К каждой из своих форм в input добавил
name="passport"
name="organ"
name="data"
name="fio"
|
|
Сообщение от Marts
|
|
const o = el.closest('div')
|
const o в вашем случае должно указывать на конкретную форму |
|
30.09.2022, 14:30
|
|
Новичок на форуме
|
|
Регистрация: 30.09.2022
Сообщений: 8
|
|
const o = el.closest('div') за место 'div' надо что-то другое указать? А не подскажите ?
<form autocomplete="on">
<div class="wrap">
<div class="left clearfix">
<!--
<div class="search">
<form class="search" action="search.php" method="post">
Поиск по ФИО: <input type="text" name="name"><br>
<input type="submit">
</form>
</div>
-->
<ul class="list">
<li class="list-item">
<span class="list-span">ФИО</span>
<input type="text" autocomplete="on" data-number="1" class="input input_top input_surname1" value=""
size="25">
</li>
<!--
<li class="list-item">
<span class="list-span">Имя</span>
<input type="text" autocomplete="on" data-number="1" class="input input_top input_name1" value="">
</li>
<li class="list-item">
<span class="list-span">Отчество</span>
<input type="text" autocomplete="on" data-number="1" class="input input_top input_patronymic1" value="">
</li>
-->
<li class="list-item">
<span class="list-span">Вид ТС</span>
<input type="text" name="data" autocomplete="on" data-number="1" class="input input_top input_view1" value="">
</li>
<li class="list-item">
<span class="list-span">С/№ паспорта</span>
<input type="text" name="passport" autocomplete="on" data-number="1" class="input input_top input_passport1"
value="">
</li>
</li class="list-item">
<span class="list-span">Компания</span>
<input type="text" name="organ" autocomplete="on" data-number="1" class="input input_top input_company1" value="">
</li>
<li class="list-item">
<span class="list-span">Число</span>
<script>
var d = new Date();
var month = ['Января', 'Февраля', 'Марта', 'Апреля', 'Мая', 'Июня', 'Июля', 'Августа', 'Сентября', 'Октября', 'Ноября', 'Декабря'];
document.write('<input type="text" data-number="1" class="input input_top input-date input_date1" value="' + d.getDate() + '" >');
</script>
<span class="list-span">Месяц</span>
<script>
document.write('<input type="text" data-number="1" class="input input_top input-month input_month1" value="' + month[d.getMonth()] + '" >');
</script>
<!-- <input type="text" data-number="1" class="input input_top input-month input_month1" value="Июль"> -->
</li>
</ul>
<button type="button" class="btn btn-default btn_top">Напечатать 1 бланк</button>
<div>
<select class="employees">
<option>Сотрудник ...</option>
<option>А. С. Сидоров</option>
<option>В. П. Петров</option>
</select>
<script>document.querySelectorAll('.employees').forEach(el => {
el.addEventListener('change', function() {
const d = arr[this.selectedIndex];
const o = el.closest('list-item')
for(var k in d) o.querySelector('[name="'+k+'"]').value = d[k];
})</script>
</div>
|
|
30.09.2022, 15:09
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,236
|
|
|
Сообщение от Marts
|
|
за место 'div' надо что-то другое указать?
|
Тут нужен селектор родительского элемента в котором селект вместе с другими полями с именами
|
Сообщение от Marts
|
name="passport"
name="organ"
name="data"
name="fio"
|
|
|
30.09.2022, 15:11
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,236
|
|
|
Сообщение от Marts
|
<ul class="list">
|
Этот родитель вроде должен подойти...
const o = el.closest('.list')
|
|
|
|
