Как посчитать сумму ячеек в строках таблицы на JS?

Question

[$kyD@rk]

Как можно считать сумму значений в строках в таблице? Количество td может быть разное.

Comments

[Сергей Сергей]

Навскидку

[ ...document.querySelectroAll( 'input.mat_count' ) ].reduce( ( a, c ) => a + ( parseInt( c.value ) || 0 ), 0 );

Answer 1

[Алексей Уколов]

1. Получаем все нужные td, используя querySelectorAll.
   
2. Получаем для каждой ячейки значение (видимо, из инпута?).
   
3. Приводим значение к числу.
   
4. Прибавляем получившееся число к сумме.
   

Какой конкретно из этих элементарных пунктов вызывает у вас сложности? В чём эти сложности заключаются? Какой код у вас получился на данный момент?

Comments

[$kyD@rk]

@foreach (var it in ViewBag.roles)
 {
     if(item.Sort ==1)
     {
         <td>
             <input type="text" class="form-control btn-block" id="@item.Id [e-mail]" readonly />
         </td>
     }
     else
     {
          <td>
             <input type="text" class="mat_count" id="1_mat_1" @* id="@item.Id [e-mail]" *@ value="0" />
     </td>
     }
    
 }

Вот так формирую таблицу. Вопрос как эти td перебрать еще и построково.
В данный момент у меня id ячеек получаются таким образом:
1_0/1_3/1_5/1_8
2_0/2_3/2_5/2_8
3_0/3_3/3_5/3_8
4_0/4_3/4_5/4_8
5_0/5_3/5_5/5_8
6_0/6_3/6_5/6_8
Или я неправильно формирую id? Может нужно каким то другим образом?

[Алексей Уколов]

Совершенно не важно как вы формируете страницу - в итоге у вас есть HTML, с которым вы можете работать. Например, получить все tr внутри table, а для каждого полученного tr получить лежащие внутри td. При этом id вообще не используются (вам ведь не конкретный элемент нужен, а все подряд).

[FeST1VaL]

$kyD@rk, так какая разница как вы формируете, хоть они будут с одним классом, если пройтись по 4 пунктам которые расписал выше Алексей, то все получится

[$kyD@rk]

Алексей Уколов, Это формирование таблицы на Razor и html
С помощью JS я хочу сумму подсчитывать

[$kyD@rk]

Алексей Уколов, в первый td записывать результат нужно, поэтому нужно как то по id разделить ячейки

[Алексей Уколов]

Первый td легко получить и без id - он первый. Добавление id, наоборот вам всё усложнит, потому что он уникальный и придётся как-то закостыливать его использование для каждой строки в отдельности.

Давайте вернёмся к вопросам, которые я вам задал выше - ответьте на них.