Как посчитать сумму в таблицы из полей Input
Здравствуйте, помогите не могу понять как мне посчитать суму input в которых класс timer_input и получить суму в конце таблицы. Пробовал много вариантов ну не один не подходит :(
<table class="table_index">
<tr class="number_">
<td>
<input class="form-control js-time_744 timer_input" step="0.01" type="number" value="6.0" name="time_tracking[time]" id="time_tracking_time">
<input type="hidden" name="tracking[id]" id="tracking_id" value="744">
<input type="hidden" name="time_tracking[user_id]" id="time_tracking_user_id" value="58">
<input type="hidden" name="time_tracking[date]" id="time_tracking_date">
</td>
</tr>
<tr class="number_">
<td>
<input class="form-control js-time_745 timer_input" step="0.01" type="number" value="4.0" name="time_tracking[time]" id="time_tracking_time">
<input type="hidden" name="tracking[id]" id="tracking_id" value="745">
<input type="hidden" name="time_tracking[user_id]" id="time_tracking_user_id" value="58">
<input type="hidden" name="time_tracking[date]" id="time_tracking_date">
</td>
</tr>
<td id="sum_total">Общая сумма</td>
</table>
|
document.getElementById('sum_total').textContent = [].reduce.call(
document.querySelectorAll('input.timer_input'),
(res, node) => res + +(node.value || 0),
0
);
|
Nexus,
Спасибо большое. |
Nexus,
Можете ещё подсказать, у меня есть
<ul class="nav nav-tabs">
<li>
<a data-toggle="tab" href="#Monday">04 Mar Monday 0.0</a>
</li>
<li>
<a data-toggle="tab" href="#Tuesday">05 Mar Tuesday 0.0</a>
</li>
<li class="active">
<a data-toggle="tab" href="#Wednesday">06 Mar Wednesday 0.0</a>
</li>
<li>
<a data-toggle="tab" href="#Thursday">07 Mar Thursday 0.0</a>
</li>
<li>
<a data-toggle="tab" href="#Friday">08 Mar Friday 0.0</a>
</li>
<li>
<a data-toggle="tab" href="#Saturday">09 Mar Saturday 0.0</a></li>
<li>
<a data-toggle="tab" href="#Sunday">10 Mar Sunday 0.0</a>
</li>
</ul>
Когда я нажимаю на любой день у меня открывается таблица, и в таблице есть например я сейчас на таблице
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade" id="Monday">
<table class="table_index">
<tr class="number_">
<td>
<input class="form-control js-time_744 timer_input" step="0.01" type="number" value="6.0" name="time_tracking[time]" id="time_tracking_time">
<input type="hidden" name="tracking[id]" id="tracking_id" value="744">
<input type="hidden" name="time_tracking[user_id]" id="time_tracking_user_id" value="58">
<input type="hidden" name="time_tracking[date]" id="time_tracking_date">
</td>
</tr>
<tr class="number_">
<td>
<input class="form-control js-time_745 timer_input" step="0.01" type="number" value="4.0" name="time_tracking[time]" id="time_tracking_time">
<input type="hidden" name="tracking[id]" id="tracking_id" value="745">
<input type="hidden" name="time_tracking[user_id]" id="time_tracking_user_id" value="58">
<input type="hidden" name="time_tracking[date]" id="time_tracking_date">
</td>
</tr>
<tr>
<td id="sum_total">Общая сумма</td>
</tr>
</table>
как можно получить суму каждой таблице, сейчас я получаю суму всех таблиц :( мне нужно что сума отображалась для каждой таблице. |
id - уникальный идентификатор.
Цитата:
id="sum_total" замените на class="sum_total" и попробуйте так:
$('.tab-content .table_index').each(function() {
$(this).find('.sum_total').text([].reduce.call(
this.querySelectorAll('input.timer_input'),
(res, node) => res + +(node.value || 0),
0
));
});
|
Nexus,
Спасибо большое!!! ну сейчас всё хорошо работает, ну только когда перезагружу страницу, можно как то сделать что бы оно работало без перезагрузки ? :) |
$('body').on('change', '.timer_input', function() {
$('.tab-content .table_index').each(function() {
$(this).find('.sum_total').text([].reduce.call(
this.querySelectorAll('input.timer_input'),
(res, node) => res + +(node.value || 0),
0
));
});
})
|
Так правильно будет?
$('body').on('change', '.timer_input', function() {
$('.tab-content .table_index').each(function() {
$(this).find('.sum_total').text([].reduce.call(
this.querySelectorAll('input.timer_input'),
(res, node) => res + +(node.value || 0),
0
));
});
})
|
Цитата:
|
Nexus,
Спасибо большое за помощь! |
| Часовой пояс GMT +3, время: 15:33. |