Суммировать выбранные значения из select и устанавливать в input

[Ambassador]

Здравствуйте.
Моя задача заключается в том что бы при выборе значения из селектов, сразу проставлялась сумма в последнем элементе строки(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.
Подскажите, пож-та, в чем заключается ошибка? Может есть более лаконичное и правильное решение моей задачи.
Заранее спасибо

[j0hnik]

<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>

вот вам пример

[Strongman]

Цитата кода ТС:
"<? foreach ($arResult["UserQuestion"] as $key => $value): ?>" - а зачем столько вопросов, я не понял? Разве есть такой тэг-вопрос вообще?
Парни, подскажите, пожалуйста.

[laimas]

а зачем столько вопросов, я не понял?

http://php.net/manual/ru/language.ba...ax.phptags.php

[Dilettante_Pro]

<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>