Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.06.2018, 00:06
Аспирант
Отправить личное сообщение для Ambassador Посмотреть профиль Найти все сообщения от Ambassador
 
Регистрация: 12.11.2015
Сообщений: 68

Суммировать выбранные значения из select и устанавливать в input
Здравствуйте.
Моя задача заключается в том что бы при выборе значения из селектов, сразу проставлялась сумма в последнем элементе строки(input Итоговое значение).
Сам html c php следующий:
<tbody>
            <? foreach ($arResult["UserQuestion"] as $key => $value): ?>
                <tr><td>Отдел - <?= $key ?></td></tr>                  
                <? foreach ($value as $ki => $inputquestion): ?>                    
                    <tr>
                    <td ><?= $ki ?></td>
                    <? foreach ($inputquestion as $kq => $questionvalue): ?>
                        <? foreach ($questionvalue as $kv => $que): ?>
                            <td><?if($que != "Итоговое значение") :?>
                                <select onchange="OnSelectionChange(this)" class="sel_val" name="val_name[<?=$ki?>][<?=$que?>][]"><option value=""></option><option value="1">1</option><option value="0">0</option><option value="-1">-1</option></select>
                                <?else :?>
                                <input name="val_name"  class="itoginp" type="text" />
                                <?endif;?>
                            </td>
                        <? endforeach; ?>
                    <? endforeach; ?>
                <? endforeach; ?>
                </tr>
 <? endforeach; ?>
</tbody>


На select установил событие onchange="OnSelectionChange(this)", функцию написал следующим образом:
function OnSelectionChange (_this) {
    var tr = $(_this).closest('tr');//находим ближайшего родителя tr
    var sum = 0;
   //в родителе находим все селекты и суммируем значения
   tr.find('.sel_val').each(function(){
       sum += $(this).val();
   });
   //в родителе находим итоговый инпут и меняем итоговое значение
    tr.find('.itoginp').val(sum);
}


Но итоговое значение в input всегда проставляется 0.
Подскажите, пож-та, в чем заключается ошибка? Может есть более лаконичное и правильное решение моей задачи.
Заранее спасибо
Ответить с цитированием
  #2 (permalink)  
Старый 29.06.2018, 00:18
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

<select>
		<option value="0">0</option>
		<option value="10">10</option>
		<option value="20">20</option>
	</select>

	<select>
		<option value="0">0</option>
		<option value="10">10</option>
		<option value="20">20</option>
	</select>

	<output></output>

	<script>
		var sel = document.querySelectorAll('select');
		sel.forEach(el=>el.onchange = e => document.querySelector('output').value = [].reduce.call(sel, (c,el)=>c+el.value*1,0)); 
	</script>

вот вам пример
Ответить с цитированием
  #3 (permalink)  
Старый 29.06.2018, 07:48
Кандидат Javascript-наук
Отправить личное сообщение для Strongman Посмотреть профиль Найти все сообщения от Strongman
 
Регистрация: 22.03.2016
Сообщений: 132

Цитата кода ТС:
"<? foreach ($arResult["UserQuestion"] as $key => $value): ?>" - а зачем столько вопросов, я не понял? Разве есть такой тэг-вопрос вообще?
Парни, подскажите, пожалуйста.
Ответить с цитированием
  #4 (permalink)  
Старый 29.06.2018, 08:50
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от Strongman
а зачем столько вопросов, я не понял?
http://php.net/manual/ru/language.ba...ax.phptags.php
Ответить с цитированием
  #5 (permalink)  
Старый 29.06.2018, 10:31
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

<table>
   <tbody>
      <tr><td>Отдел - 1</td></tr> 
      <tr>
         <td>
            <select onchange="OnSelectionChange(this)" class="sel_val">
               <option value="0">0</option>
               <option value="10">10</option>
               <option value="20">20</option>
            </select>
         </td>
         <td>
            <select onchange="OnSelectionChange(this)" class="sel_val">
               <option value="0">0</option>
               <option value="10">10</option>
               <option value="20">20</option>
            </select>
         </td>
         <td>
            <input name="val_name"  class="itoginp" type="text" />
         </td>
      </tr>
   </tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script>
function OnSelectionChange (_this) {
    var tr = $(_this).closest('tr');//находим ближайшего родителя tr
    var sum = 0;
   //в родителе находим все селекты и суммируем значения
   tr.find('.sel_val').each(function(){
       sum += +$(this).val();
   });
   //в родителе находим итоговый инпут и меняем итоговое значение
    tr.find('.itoginp').val(sum);
}
</script>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывести значения value из select в input Jeick9 Events/DOM/Window 28 29.11.2017 08:57
Проверка нескольких select на одинаковые значения emulexx Общие вопросы Javascript 6 07.04.2015 15:19
изменение значения input при смене значения select galart jQuery 4 30.01.2015 19:39
При добавлении DOCTYPE "плывут" размеры input type=text Demath (X)HTML/CSS 4 08.07.2012 19:27
выбор значения select -> скрытый input allie jQuery 2 16.08.2011 12:28