Javascript-Sum (Таблица) конкретной колонки вычисленных входов

простите меня, поскольку я нахожусь на ранних этапах веб-разработки. Здесь я хотел бы взять общую сумму (sum) из ряда строк, которые были рассчитаны, как показано ниже. Пожалуйста, помогите мне в генерации кода для расчета каждой строки столбца Amount. Я пробовал все методы, включая другие ответы в stackoverflow и quora, но безрезультатно и оставил в море путаницы. Любая помощь в этом отношении было бы оценена пожалуйста (либо комментарий или скрипка или ответ)Javascript-Sum (Таблица) конкретной колонки вычисленных входов

<table> 
    <tr> 
     <th>Description</th> 
     <th>Quantity</th> 
     <th>Rate</th> 
     <th>Amount</th> 
    </tr> 
    <tr> 
     <td>Steel</td> 
     <td><input id="qty1" type="text" oninput="cal1()" /></td> 
     <td><input id="rate1" type="text" oninput="cal1()" /></td> 
     <td><input id="amt1" type="text" /></td> 
    </tr> 
    <tr> 
     <td>Cement</td> 
     <td><input id="qty2" type="text" oninput="cal2()" /></td> 
     <td><input id="rate2" type="text" oninput="cal2()" /></td> 
     <td><input id="amt2" type="text" /></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td>TOTAL<input id="tot1" type="text" /></td> 
     //Here I want to know how to get the total sum of amt1(id) and amt2 (id) automatically 
    </tr> 
</table> 

<script type="text/javascript"> 
    function cal1(){ 
     var x1 = document.getElementById('qty1').value; 
     var x2 = document.getElementById('rate1').value; 
     var x3 = document.getElementById('amt1').value; 
     var x4 = x1 * x2; 
     amt1.value = x4; 
    } 
    function cal2(){ 
     var y1 = document.getElementById('qty2').value; 
     var y2 = document.getElementById('rate2').value; 
     var y3 = document.getElementById('amt2').value; 
     var y4 = y1 * y2; 
     amt2.value = y4; 
    } 
    //Here I want to know the sum of id(amt1) and (amt2) 
    </script>

Я получил выход для вычисления каждой строки в колонке «Сумма». Однако не удалось получить итоговую сумму Колонки суммы, как в этой ссылке. http://tinypic.com/view.php?pic=kales0&s=9

источник

2016-06-30 Rookie_Coder

Ознакомьтесь с примерным примером на codepen.io, чтобы вы начали.

По сути, ваши функции cal1 и cal2 не выполняли то, что вы намеревались, а также, вероятно, вам нужна другая функция, которая вычисляет общее количество, каждый раз, когда изменяется значение amt1 или amt2.

Javascript код:

function cal1() { 
    var x1 = document.getElementById('qty1'); 
    var x2 = document.getElementById('rate1'); 
    var x3 = document.getElementById('amt1'); 

    x3.value = parseInt(x1.value) + parseInt(x2.value); 

    calcTotal(); 
} 

function cal2() { 
    var y1 = document.getElementById('qty2'); 
    var y2 = document.getElementById('rate2'); 
    var y3 = document.getElementById('amt2'); 

    y3.value = parseInt(y1.value) + parseInt(y2.value); 

    calcTotal(); 
} 

function calcTotal() { 
    var amt1 = document.getElementById('amt1'); 
    var amt2 = document.getElementById('amt2'); 
    var tot1 = document.getElementById('tot1'); 

    tot1.value = parseInt(amt1.value) + parseInt(amt2.value); 
}

HTML код:

<html> 
    <head> 
    <title>calculation exercise</title> 
    </head> 
    <body> 
    <table> 
    <tr> 
     <th>Description</th> 
     <th>Quantity</th> 
     <th>Rate</th> 
     <th>Amount</th> 
    </tr> 
    <tr> 
     <td>Steel</td> 
     <td><input id="qty1" type="text" oninput="cal1()" /></td> 
     <td><input id="rate1" type="text" oninput="cal1()" /></td> 
     <td><input id="amt1" type="text" /></td> 
    </tr> 
    <tr> 
     <td>Cement</td> 
     <td><input id="qty2" type="text" oninput="cal2()" /></td> 
     <td><input id="rate2" type="text" oninput="cal2()" /></td> 
     <td><input id="amt2" type="text" /></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td>TOTAL<input id="tot1" type="text" /></td> 
    </tr> 
</table> 
</body>

источник

2016-06-30 10:12:11 pzelenovic

Javascript-Sum (Таблица) конкретной колонки вычисленных входов

ответ

Смежные вопросы