Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.

1. ## Auto calculate values

Hi.I have found this nice code through forum.Now I want to modify it a little bit.But dont know how to
It calculates amount column value by multiplying quantity to amount.i.e. amount=qty*rate and gross total is sum of all the array elements in amount.Here I want to add two more columns viz vat% and vat amount.Simply it will be amount*vat% / 100.Can anyone please tell me how I can do that?Other thing is, is it possible to separate the 5% vat and 12.5% vat values and display the total of them in respective column?
Here is the link for reference : http://kavisandeepdwivedi.com/forum.php
Please go through the code below and help me out
Code:
```<html>
<script type="text/javascript">
function tot(elem) {
var d=document.getElementById("total").value;
var total=Number(d);
var e=document.getElementById("vat5").value;
var vat5=Number(e);
var f=document.getElementById("vat12_5").value;
var vat12_5=Number(f);
var g=document.getElementById("cash_discount").value;
var cash_discount=Number(g);

var h=(total+vat5+vat12_5)-cash_discount;
document.getElementById("grand_total").value = h;
}

var total = 0;
function getValues() {
var qty = 0;
var rate = 0;
var obj = document.getElementsByTagName("input");
for(var i=0; i<obj.length; i++){
if(obj[i].name == "qty[]"){var qty = obj[i].value;}
if(obj[i].name == "rate[]"){var rate = obj[i].value;}
if(obj[i].name == "amt[]"){
if(qty > 0 && rate > 0){obj[i].value = qty*rate;total+=(obj[i].value*1);}
else{obj[i].value = 0;total+=(obj[i].value*1);}
}
}
document.getElementById("total").value = total*1;
total=0;
}

</script>
<script type="text/javascript">
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
switch(newcell.childNodes[0].type) {
case "text":
newcell.childNodes[0].value = "";
break;
case "checkbox":
newcell.childNodes[0].checked = false;
break;
case "select-one":
newcell.childNodes[0].selectedIndex = 0;
break;
}
}
}

function deleteRow(tableID)
{
try
{
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++)
{
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if (null != chkbox && true == chkbox.checked)
{
if (rowCount <= 1)
{
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
} catch(e)
{
}
getValues();
}
</script>
<body>
<form name="gr" method="post" action="<?php echo htmlentities(\$_SERVER['PHP_SELF']); ?>" onSubmit="return validateForm(this)">
<tr>
<input type="button" value="Delete Row" onClick="deleteRow('dataTable')" ></td>
<table width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0">
<td width="20"></td>
</tr>
</table>
<table border="0" id="dataTable" width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text">
<tr>
<td class="forhead" style="white-space:nowrap;" width="20"><input type="checkbox" name="chk[]"/></td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="qty[]"  onkeyup="getValues()" style="width:80px;" onBlur=""></td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="rate[]" onKeyUp="getValues()" style="width:80px;" value=""></td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="amt[]" style="width:80px;"
onKeyUp="getValues()"></td>
<select name="vat[]" style="width:80px" onChange="getValues()">
<option value="0">Select</option>
<option value="5">5</option>
<option value="12.5">12.5</option>
</select>
</td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="vat_amt[]" style="width:80px;"></td>
</tr>
</table>
<table width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0">
<tr>
<td width="80" class="forhead" style="white-space:nowrap;"><input type="text"  id="total" name="total[]" style="width:80px;" value=""></td>

</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  name="vat5[]" id="vat5" style="width:80px;"></td>
</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  name="vat12_5[]" id="vat12_5" style="width:80px;"></td>
</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  id="cash_discount" name="cash_discount[]" style="width:80px;" value=""></td>
</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  name="grand_total" id="grand_total" onKeyUp="tot()" style="width:80px;"></td>
</tr>
<tr>
<td align="center" colspan="6">
<input name="Submit" type="submit" value="Save" style="text-decoration:none"/>
<input type="reset" value="Cancel" onClick="window.location.href='<?php echo \$_SERVER['PHP_SELF'];?>'">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</form>
</body>
</html>```

• This is Javascript coding

• Originally Posted by anita_86
Hi.I have found this nice code through forum.Now I want to modify it a little bit.But dont know how to
It calculates amount column value by multiplying quantity to amount.i.e. amount=qty*rate and gross total is sum of all the array elements in amount.Here I want to add two more columns viz vat% and vat amount.Simply it will be amount*vat% / 100.Can anyone please tell me how I can do that?Other thing is, is it possible to separate the 5% vat and 12.5% vat values and display the total of them in respective column?
Here is the link for reference : http://kavisandeepdwivedi.com/forum.php
Please go through the code below and help me out
Code:
```<html>
<script type="text/javascript">
function tot(elem) {
var d=document.getElementById("total").value;
var total=Number(d);
var e=document.getElementById("vat5").value;
var vat5=Number(e);
var f=document.getElementById("vat12_5").value;
var vat12_5=Number(f);
var g=document.getElementById("cash_discount").value;
var cash_discount=Number(g);

var h=(total+vat5+vat12_5)-cash_discount;
document.getElementById("grand_total").value = h;
}

var total = 0;
function getValues() {
var qty = 0;
var rate = 0;
var obj = document.getElementsByTagName("input");
for(var i=0; i<obj.length; i++){
if(obj[i].name == "qty[]"){var qty = obj[i].value;}
if(obj[i].name == "rate[]"){var rate = obj[i].value;}
if(obj[i].name == "amt[]"){
if(qty > 0 && rate > 0){obj[i].value = qty*rate;total+=(obj[i].value*1);}
else{obj[i].value = 0;total+=(obj[i].value*1);}
}
}
document.getElementById("total").value = total*1;
total=0;
}

</script>
<script type="text/javascript">
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
switch(newcell.childNodes[0].type) {
case "text":
newcell.childNodes[0].value = "";
break;
case "checkbox":
newcell.childNodes[0].checked = false;
break;
case "select-one":
newcell.childNodes[0].selectedIndex = 0;
break;
}
}
}

function deleteRow(tableID)
{
try
{
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++)
{
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if (null != chkbox && true == chkbox.checked)
{
if (rowCount <= 1)
{
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
} catch(e)
{
}
getValues();
}
</script>
<body>
<form name="gr" method="post" action="<?php echo htmlentities(\$_SERVER['PHP_SELF']); ?>" onSubmit="return validateForm(this)">
<tr>
<input type="button" value="Delete Row" onClick="deleteRow('dataTable')" ></td>
<table width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0">
<td width="20"></td>
</tr>
</table>
<table border="0" id="dataTable" width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text">
<tr>
<td class="forhead" style="white-space:nowrap;" width="20"><input type="checkbox" name="chk[]"/></td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="qty[]"  onkeyup="getValues()" style="width:80px;" onBlur=""></td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="rate[]" onKeyUp="getValues()" style="width:80px;" value=""></td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="amt[]" style="width:80px;"
onKeyUp="getValues()"></td>
<select name="vat[]" style="width:80px" onChange="getValues()">
<option value="0">Select</option>
<option value="5">5</option>
<option value="12.5">12.5</option>
</select>
</td>
<td class="forhead" style="white-space:nowrap;" width="80"><input type="text"  name="vat_amt[]" style="width:80px;"></td>
</tr>
</table>
<table width="38%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0">
<tr>
<td width="80" class="forhead" style="white-space:nowrap;"><input type="text"  id="total" name="total[]" style="width:80px;" value=""></td>

</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  name="vat5[]" id="vat5" style="width:80px;"></td>
</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  name="vat12_5[]" id="vat12_5" style="width:80px;"></td>
</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  id="cash_discount" name="cash_discount[]" style="width:80px;" value=""></td>
</tr>
<tr>
<td class="forhead" style="white-space:nowrap;"><input type="text"  name="grand_total" id="grand_total" onKeyUp="tot()" style="width:80px;"></td>
</tr>
<tr>
<td align="center" colspan="6">
<input name="Submit" type="submit" value="Save" style="text-decoration:none"/>
<input type="reset" value="Cancel" onClick="window.location.href='<?php echo \$_SERVER['PHP_SELF'];?>'">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</form>
</body>
</html>```
This is not really php. and javascript math is pretty easy. you want "amount*vat% / 100"?

Code:
`amount= (total * vat ) / 100`
Your code is kind of confusing so you will need to code in the values [probably by variables taken from getElementById]

and as for doing multiple "vat" totals, that's not too hard, just do another calculation with the vat percentage different, and set it to another value, then put it in a table.

• Thanks for your reply.I tried this with the code.But its not working as im not too well with javascript. I guess I posted it in wrong forum

Can you please explain how can I separate the different vat values in a variable?Because the names of the fields will be the same and I dont find easier way to separate them.

• Originally Posted by anita_86
Thanks for your reply.I tried this with the code.But its not working as im not too well with javascript. I guess I posted it in wrong forum

Can you please explain how can I separate the different vat values in a variable?Because the names of the fields will be the same and I dont find easier way to separate them.
Yes, this is the wrong category. This is PHP, JavaScript is where you should have posted it.

I went to the link you posted, and realized this was in a loop. I can't quite figure out how it works in the loop, so unfortunately I don't know what to say. You would have better luck in the JavaScript form, I'm not sure if you should just repost this in the JavaScript form or if you should ask a mod to move the thread.

Anyone else know?

• Moving from PHP forum to Javascript forum.
The client developers will be able to give you a lot better idea of what to do than us (well, better than myself at least :P)

• Thx for your time mvmacd. Im also dealing with the same problem and could not find how this code works in a loop.May be due to less knowledge of js.

•