Суммировать выбранные значения из 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. Подскажите, пож-та, в чем заключается ошибка? Может есть более лаконичное и правильное решение моей задачи. Заранее спасибо |
<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>
вот вам пример |
Цитата кода ТС:
"<? foreach ($arResult["UserQuestion"] as $key => $value): ?>" - а зачем столько вопросов, я не понял? Разве есть такой тэг-вопрос вообще? Парни, подскажите, пожалуйста. |
Цитата:
|
<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>
|
| Часовой пояс GMT +3, время: 00:21. |