I have an HTML table with columns of input boxes(Quantity, Price, Discount and Total). I made a JS function for adding as many rows as I need. I would like to make the Total column, for each row, to display automatically the value of this formula:
(Quantity * Price) - ( Quantity * Price * (Discount/100)) .
I tried numerous JavaScript code, but I have been unable to get anything to correctly work.
HTML:
<table id="myTable">
<tr>
<th width="65%"></th>
<th align="center" width="5%">Q<br>-ty</th>
<th align="center" width="10%">Price,</br>$</th>
<th align="center" width="5%">Discount,<br>%</th>
<th align="center" width="15%">Total, $<br>(Without tax)</th>
</tr>
<tr>
<td width="65%"><input class="Left" size="100" type="text" name="Description"></td>
<td align="center" width="5%"><input type="number" name="quantity" min="1" max="99"></td>
<td align="center" width="10%"><input type="number" name="summ" min="0" max="999999"></td>
<td align="center" width="5%"><input type="number" name="rate" min="0" max="100"></td>
<td align="center" width="15%"><input align="center" type="number" name="total" min="0" max="99999999"></td>
</tr>
</table>
<button onclick="addRow()">Add Row</button>
Javascript:
function addRow() {
var table = document.getElementById("myTable");
var row = table.insertRow();
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
var cell5 = row.insertCell(4);
cell1.innerHTML = "<input class=\"Left\" size=\"100\" type=\"text\" name=\"Description\">";
cell2.innerHTML = "<div align=\"center\"><input type=\"number\" name=\"quantity\" min=\"1\" max=\"99\"></div>";
cell3.innerHTML = "<div align=\"center\"><input type=\"number\" name=\"summ\" min=\"0\" max=\"999999\"></div>";
cell4.innerHTML = "<div align=\"center\"><input type=\"number\" name=\"rate\" min=\"0\" max=\"100\"></div>";
cell5.innerHTML = "<div align=\"center\"><input type=\"number\" name=\"total\" min=\"0\" max=\"99999999\"></div>";
}
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire