Как при загрузке страницы записать в textarea данные соответствующие selected из поля
При загрузке в форму данных с сервера есть поля select и textarea. В этих полях есть данные. Т.е. у каждого option есть набор данных для textarea. Сразу загрузить эти данные в textarea не получается, т.к. на момент загрузки формы невозможно определить, что будет в selected option в поле select. При этом загрузить все возможные варианты option возможно.
Вопрос: как после загрузки всех данных в форму вставлять в textarea то, что соответствует selected option и менять при необходимости выбора другого элемента option данные в textarea? Надеюсь, что всё понятно изложил, если нет - спрашивайте. Всем заранее спасибо за участие! |
javascript_pupil,
непонятно в чём проблема? |
Что грузится то? Страница с сервера?
Цитата:
Ну а так, после загрузки страницы, определяете какая option selected, берете связанные с ней данные и переносите в textarea |
Цитата:
Цитата:
Цитата:
|
javascript_pupil,
без конкретики, можно только гадать, с чем у вас проблема. |
Цитата:
<select name="name"> <option value="one"> <option value="two" selected> <option value="three"> </select> <textarea name="results"> one 11111 two 22222 three 33333 </textarea> а нужно, чтобы было так: <textarea name="results"> 22222 </textarea> и при смене selected textarea получала бы значение "11111" или "33333". |
javascript_pupil,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
document.addEventListener("DOMContentLoaded", function() {
let select = document.querySelector("[name='name']"),
textarea = document.querySelector("[name='results']"),
obj = {
one: 11111,
two: 22222,
three: 33333
};
const load = () => textarea.value = obj[select.value];
select.addEventListener("change", load);
load();
})
</script>
</head>
<body>
<select name="name">
<option value="one">one</option>
<option value="two" selected>two</option>
<option value="three">three</option>
</select>
<textarea name="results">
one
11111
two
22222
three
33333
</textarea>
</body>
</html>
|
Ну если с сервера приходит так заполненная textarea, то этот obj еще надо получить из textarea
Тогда код будет немного другой
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
document.addEventListener("DOMContentLoaded", function() {
const select = document.querySelector("[name='name']");
const textarea = document.querySelector("[name='results']");
const strings = textarea.value.split('\n');
const obj = {};
for (let i = 0; i<strings.length; i+=2) {
if (!strings[i]) continue;
obj[strings[i]] = strings[i+1]
}
const load = () => textarea.value = obj[select.value];
select.addEventListener("change", load);
load();
})
</script>
</head>
<body>
<select name="name">
<option value="one">one</option>
<option value="two" selected>two</option>
<option value="three">three</option>
</select>
<textarea name="results">
one
11111
two
22222
three
33333
</textarea>
</body>
</html>
|
рони, спасибо!
С сервера она должна приходить пустая, а заполнятся уже по мере выбора select option. В идеале, если select option только одна, данные сразу можно пускать в textarea, тем более, что select option в случае единственной записи сразу будет в положении selected. Тут другой косяк вылез. Я, чтобы упростить описание задачи написал переменные в одну строку, а в реальности они выглядят так:
obj = {
brands: "0
0",
chat: "28
50
38
84"
};
И если с переменными из одной строкой у меня всё работает, то конструкция выше, где у переменных есть переносы строк - нет. Попробовал "завернуть" в кавычки (как на примере), но тоже не помогает. voraa, спасибо, Ваш вариант сейчас тоже буду пробовать. Дело в том, что данные для textarea я могу вытащить только когда обрабатывается именно поле textarea, программа в этот момент не знает что за данные ранее были внесены в select. И менять движок - не вариант, иначе я бы их сразу после получения значений select option грузил бы соответствующие данные в textarea. Но textarea "знает" какие option могут быть у select. |
Такого объекта, где строка разбита и продолжается на другую строку просто быть не может. По синтаксису js не пройдет с такими(") кавычками. Нужны другие (`).
Цитата:
Цитата:
Ну проще ведь написать сразу, что нужно, а не выдавливать условия по капле. |
| Часовой пояс GMT +3, время: 04:25. |