<html>
<head>
<script src="file:///E:/Scripts/jquery-1.7.1.min.js"></script>
<script>
$(document).ready(function()
{
$('input[type=text][usedToSum="true"]').bind('blur',function(e)
{
Data()
});
});
function Data()
{
Basic=0,VAT=0,Sale=0,Excise=0,Quantity=0
$("table tr[det=product]").each(function()
{
row_total = 0;
$("td:not(.Total) input",this).each(function()
{
if ($(this).parent().hasClass('Basic')) {
Basic = parseFloat($(this).val())
}
if ($(this).parent().hasClass('Quantity')) {
Quantity = parseFloat($(this).val())
}
if ($(this).parent().hasClass('Excise')) {
Excise = parseFloat($(this).val())
}
if ($(this).parent().hasClass('Sale')) {
Sale = parseFloat($(this).val())
}
if ($(this).parent().hasClass('VAT')) {
VAT = parseFloat($(this).val())
}
});
row_total = parseFloat((Basic * Quantity) + ((Basic * Quantity)*(Excise + VAT + Sale)) / 100);
$(".Total :input:text", this).val(row_total);
});
}
function AddMore()
{
$("table tr:last").after('<tr det="product"><td class="Basic"><input type="text" id="Basic" usedToSum="true" onblur="Data()"></td><td class="Quantity"><input type="number" id="Quantity" min="1" max="100" onchange="Data()"></td><td class="Excise"><input type="text" usedToSum="true" onblur="Data()"></td><td class="Sale"><input type="text" id="Sale" onblur="Data()" usedToSum="true"></td> <td class="VAT"><input type="text" id="VAT" onblur="Data()" usedToSum="true"></td> <td class="Total"><input type="text" id="Total" readonly></td> <td><button onclick="$(this).parent().parent().remove(); ">X</button></td></tr>');
}
</script>
</head>
<Body>
<input type="Button" value="Add More"onclick="AddMore()">
<table>
<tr>
<th>Basic Amount</th>
<th>Quantity</th>
<th>Excise Duty</th>
<th>Sale Tax</th>
<th>VAT</th>
<th>Total</th>
<th>Remove</th>
</tr>
<tr det="product">
<td class="Basic"><input type="text" id="Basic" usedToSum="true"></td>
<td class="Quantity"><input type="number" id="Quantity" min="1" max="100" onchange="Data()"></td>
<td class="Excise"><input type="text" usedToSum="true"></td>
<td class="Sale"><input type="text" id="Sale" usedToSum="true"></td>
<td class="VAT"><input type="text" id="VAT" usedToSum="true"></td>
<td class="Total"><input type="text" id="Total" readonly></td>
<td><button onclick="$(this).parent().parent().remove(); ">X</button></td>
</tr>
</table>
</Body>
</html>
<head>
<script src="file:///E:/Scripts/jquery-1.7.1.min.js"></script>
<script>
$(document).ready(function()
{
$('input[type=text][usedToSum="true"]').bind('blur',function(e)
{
Data()
});
});
function Data()
{
Basic=0,VAT=0,Sale=0,Excise=0,Quantity=0
$("table tr[det=product]").each(function()
{
row_total = 0;
$("td:not(.Total) input",this).each(function()
{
if ($(this).parent().hasClass('Basic')) {
Basic = parseFloat($(this).val())
}
if ($(this).parent().hasClass('Quantity')) {
Quantity = parseFloat($(this).val())
}
if ($(this).parent().hasClass('Excise')) {
Excise = parseFloat($(this).val())
}
if ($(this).parent().hasClass('Sale')) {
Sale = parseFloat($(this).val())
}
if ($(this).parent().hasClass('VAT')) {
VAT = parseFloat($(this).val())
}
});
row_total = parseFloat((Basic * Quantity) + ((Basic * Quantity)*(Excise + VAT + Sale)) / 100);
$(".Total :input:text", this).val(row_total);
});
}
function AddMore()
{
$("table tr:last").after('<tr det="product"><td class="Basic"><input type="text" id="Basic" usedToSum="true" onblur="Data()"></td><td class="Quantity"><input type="number" id="Quantity" min="1" max="100" onchange="Data()"></td><td class="Excise"><input type="text" usedToSum="true" onblur="Data()"></td><td class="Sale"><input type="text" id="Sale" onblur="Data()" usedToSum="true"></td> <td class="VAT"><input type="text" id="VAT" onblur="Data()" usedToSum="true"></td> <td class="Total"><input type="text" id="Total" readonly></td> <td><button onclick="$(this).parent().parent().remove(); ">X</button></td></tr>');
}
</script>
</head>
<Body>
<input type="Button" value="Add More"onclick="AddMore()">
<table>
<tr>
<th>Basic Amount</th>
<th>Quantity</th>
<th>Excise Duty</th>
<th>Sale Tax</th>
<th>VAT</th>
<th>Total</th>
<th>Remove</th>
</tr>
<tr det="product">
<td class="Basic"><input type="text" id="Basic" usedToSum="true"></td>
<td class="Quantity"><input type="number" id="Quantity" min="1" max="100" onchange="Data()"></td>
<td class="Excise"><input type="text" usedToSum="true"></td>
<td class="Sale"><input type="text" id="Sale" usedToSum="true"></td>
<td class="VAT"><input type="text" id="VAT" usedToSum="true"></td>
<td class="Total"><input type="text" id="Total" readonly></td>
<td><button onclick="$(this).parent().parent().remove(); ">X</button></td>
</tr>
</table>
</Body>
</html>