Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.07.2016, 00:09
Интересующийся
Отправить личное сообщение для mikhael Посмотреть профиль Найти все сообщения от mikhael
 
Регистрация: 11.07.2016
Сообщений: 15

при выборе input[radio] заполнять input[text]
Всем, доброе время суток.
Просьба помочь.

Есть html код:
<form class="webform4" id="webform-4">
<input required="required" type="radio" id="edit-submitted-2-1" name="submitted[2]" value="a" class="form-radio">
<input required="required" type="radio" id="edit-submitted-2-2" name="submitted[2]" value="ab" class="form-radio">
<input required="required" type="radio" id="edit-submitted-2-3" name="submitted[2]" value="ba" class="form-radio">
<input required="required" type="radio" id="edit-submitted-2-4" name="submitted[2]" value="b" class="form-radio">
<input class="form-control form-text" type="text" id="edit-submitted-2a" name="submitted[2a]" value="" size="60" maxlength="128">
<input class="form-control form-text" type="text" id="edit-submitted-2b" name="submitted[2b]" value="" size="60" maxlength="128">
<input required="required" type="radio" id="edit-submitted-3-1" name="submitted[3]" value="a" class="form-radio">
<input required="required" type="radio" id="edit-submitted-3-2" name="submitted[3]" value="ab" class="form-radio">
<input required="required" type="radio" id="edit-submitted-3-3" name="submitted[3]" value="ba" class="form-radio">
<input required="required" type="radio" id="edit-submitted-3-4" name="submitted[3]" value="b" class="form-radio">
<input class="form-control form-text" type="text" id="edit-submitted-3a" name="submitted[3a]" value="" size="60" maxlength="128">
<input class="form-control form-text" type="text" id="edit-submitted-3b" name="submitted[3b]" value="" size="60" maxlength="128">
.....
<input required="required" type="radio" id="edit-submitted-n-1" name="submitted[n]" value="a" class="form-radio">
<input required="required" type="radio" id="edit-submitted-n-2" name="submitted[n]" value="ab" class="form-radio">
<input required="required" type="radio" id="edit-submitted-n-3" name="submitted[n]" value="ba" class="form-radio">
<input required="required" type="radio" id="edit-submitted-n-4" name="submitted[n]" value="b" class="form-radio">
<input class="form-control form-text" type="text" id="edit-submitted-na" name="submitted[na]" value="" size="60" maxlength="128">
<input class="form-control form-text" type="text" id="edit-submitted-nb" name="submitted[nb]" value="" size="60" maxlength="128">
</form>

Нужно, чтоб при выборе, к примеру (name="submitted[2]" value="a") в (name="submitted[2a]") заполнялось 10 а в (name="submitted[2b]") заполнялось 40.
Если выбран (name="submitted[2]" value="ab") то в (submitted[2a] и submitted[2b]) 20 и 30 соответственно.
Если выбран (name="submitted[2]" value="ba") то в (submitted[2a] и submitted[2b]) 50 и 80 соответственно.
Если выбран (name="submitted[2]" value="b") то в (submitted[2a] и submitted[2b]) 70 и 60 соответственно.
И так со всеми радиокнопками, при выборе name=submitted[1...до n] заполнялись поля name=submitted[1a...до na] и name=submitted[1b...до nb]

Последний раз редактировалось mikhael, 12.07.2016 в 23:06. Причина: для Рони
Ответить с цитированием
  #2 (permalink)  
Старый 12.07.2016, 00:41
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

mikhael,
а если
Сообщение от mikhael
value="ba"
или
Сообщение от mikhael
value="b"
?
Ответить с цитированием
  #3 (permalink)  
Старый 13.07.2016, 19:42
Интересующийся
Отправить личное сообщение для mikhael Посмотреть профиль Найти все сообщения от mikhael
 
Регистрация: 11.07.2016
Сообщений: 15

Судя по комментариям, ни кто не сталкивался с таким и это не возможно.
Ответить с цитированием
  #4 (permalink)  
Старый 13.07.2016, 20:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

mikhael,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">

</head>

<body>
<form class="webform4" id="webform-4">
<input required="required" type="radio" id="edit-submitted-2-1" name="submitted[2]" value="a" class="form-radio">
<input required="required" type="radio" id="edit-submitted-2-2" name="submitted[2]" value="ab" class="form-radio">
<input required="required" type="radio" id="edit-submitted-2-3" name="submitted[2]" value="ba" class="form-radio">
<input required="required" type="radio" id="edit-submitted-2-4" name="submitted[2]" value="b" class="form-radio">
<input class="form-control form-text" type="text" id="edit-submitted-2a" name="submitted[2a]" value="" size="60" maxlength="128">
<input class="form-control form-text" type="text" id="edit-submitted-2b" name="submitted[2b]" value="" size="60" maxlength="128">
<input required="required" type="radio" id="edit-submitted-3-1" name="submitted[3]" value="a" class="form-radio">
<input required="required" type="radio" id="edit-submitted-3-2" name="submitted[3]" value="ab" class="form-radio">
<input required="required" type="radio" id="edit-submitted-3-3" name="submitted[3]" value="ba" class="form-radio">
<input required="required" type="radio" id="edit-submitted-3-4" name="submitted[3]" value="b" class="form-radio">
<input class="form-control form-text" type="text" id="edit-submitted-3a" name="submitted[3a]" value="" size="60" maxlength="128">
<input class="form-control form-text" type="text" id="edit-submitted-3b" name="submitted[3b]" value="" size="60" maxlength="128">
.....
<input required="required" type="radio" id="edit-submitted-n-1" name="submitted[n]" value="a" class="form-radio">
<input required="required" type="radio" id="edit-submitted-n-2" name="submitted[n]" value="ab" class="form-radio">
<input required="required" type="radio" id="edit-submitted-n-3" name="submitted[n]" value="ba" class="form-radio">
<input required="required" type="radio" id="edit-submitted-n-4" name="submitted[n]" value="b" class="form-radio">
<input class="form-control form-text" type="text" id="edit-submitted-na" name="submitted[na]" value="" size="60" maxlength="128">
<input class="form-control form-text" type="text" id="edit-submitted-nb" name="submitted[nb]" value="" size="60" maxlength="128">
</form>

 <script>
 window.addEventListener('DOMContentLoaded', function() {
   var form = document.querySelector('#webform-4'),
   obj = {a : [10,40], ab : [20,30], ba : [50,80], b :[70,60]};
   form.addEventListener('change', function(event) {
   var el = event.target, val = el.value;
   if(val = obj[val]) {
     while (el) {
     el = el.nextElementSibling;
     if(el && el.classList.contains("form-control")) break
     }
     el.value = val[0];
     el.nextElementSibling.value = val[1]
   }

   });
     });
 </script>
</body>
</html>

Последний раз редактировалось рони, 13.07.2016 в 22:38.
Ответить с цитированием
  #5 (permalink)  
Старый 13.07.2016, 22:35
Интересующийся
Отправить личное сообщение для mikhael Посмотреть профиль Найти все сообщения от mikhael
 
Регистрация: 11.07.2016
Сообщений: 15

Благодарю, но в этой строке «f(el.classList.contains('form-control')) break» вываливается такая ошибка «Uncaught TypeError: Cannot read property 'classList' of null» класс вроде есть, и что не так не понятно )))
Ответить с цитированием
  #6 (permalink)  
Старый 13.07.2016, 22:39
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

mikhael,
строка 42 изменена пробуйте
Ответить с цитированием
  #7 (permalink)  
Старый 14.07.2016, 00:07
Интересующийся
Отправить личное сообщение для mikhael Посмотреть профиль Найти все сообщения от mikhael
 
Регистрация: 11.07.2016
Сообщений: 15

Теперь, в строке «el.value = val[0];» вываливается такая ошибка «Uncaught TypeError: Cannot set property 'value' of null»
Ответить с цитированием
  #8 (permalink)  
Старый 14.07.2016, 00:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

mikhael,
значит ваше html отличается от того что вы предоставили
Ответить с цитированием
  #9 (permalink)  
Старый 14.07.2016, 00:30
Интересующийся
Отправить личное сообщение для mikhael Посмотреть профиль Найти все сообщения от mikhael
 
Регистрация: 11.07.2016
Сообщений: 15

Понял, проблема в "nextElementSibling", все <input> обернуты <label> и еще <div>, т.е. они не рядомстоящие.
Что посоветуете использовать, вместо "nextElementSibling"?
Ответить с цитированием
  #10 (permalink)  
Старый 14.07.2016, 00:36
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от mikhael
Что посоветуете использовать
показать структуру одной группы
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Меняющейся текст при выборе select ainur777 Общие вопросы Javascript 0 24.10.2014 22:01
Выделение строки <select> при выборе checkbox DarkMaster13 Общие вопросы Javascript 4 14.04.2014 03:30
при выборе в 1-ом select соот.-щая инф. отображается в другом select celencer Общие вопросы Javascript 1 24.05.2009 20:38
Выделение строки <select> при выборе другого <select> simbion Элементы интерфейса 12 05.05.2009 03:43
раскрывать/скрывать <td> при выборе определенного элемента списка zip Элементы интерфейса 2 19.01.2009 13:58