# How to perform calculation

I want to print subtotal from Line Total and want to show additon without using button and with using onchange but onchange() is not working,
Want to print addition of Line Total and print addition in subtotal and want to perform tax calculation and show the output in Total How to do?

``````<html>
<tr align="right">
<td colspan="3" class="noBorder">

<b><font size="4px;">Subtotal<br>Tax (%)
</font></b>
</td>

<td valign="middle" align="center" width="100%">
<input type="text" id="subtotal" name="subtotal" class="subtotal" value="0.00" onclick="result(this.form)" style="border:none;width: 100%;"/>
<input type="text" id="tax" class="tax" name="tax" style="border:none;width: 100%;">
</td>
</tr>
</html>

<script>
function result(theForm)
{
var n1=parseInt(document.getElementById('linetotal1').selectedIndex)+1;
var n2=parseInt(document.getElementById('linetotal2').selectedIndex)+1;
var n3=parseInt(document.getElementById('linetotal3').selectedIndex)+1;
var n4=parseInt(document.getElementById('linetotal4').selectedIndex)+1;
var n5=parseInt(document.getElementById('linetotal5').selectedIndex)+1;

if (isNaN(n1)) n1=0;
if (isNaN(n2)) n2=0;
if (isNaN(n3)) n3=0;
if (isNaN(n4)) n4=0;
if (isNaN(n5)) n5=0;
var subtotal=(n1+n2+n3+n4+n5);
document.getElementById("subtotal").value=subtotal;
}
</script>
``````
###### Who is Participating?

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Business Systems Analyst , ex-Senior Application EngineerCommented:
assuming you got elements like:

``````<select id="linetotal1">
..
<select id="linetotal2">
..
<select id="linetotal3">
...
``````

then you should call that function by adding:

<select id="linetotal1" onchange="result(this.form)">

please also note that you actually are not using theForm in your function, you may consider to remove that from your function when necessary.
1
Commented:
Check this code without onclick atrr in the input elements.
``````<!DOCTYPE html>
<html>
<title>HTML, CSS and JavaScript demo</title>
<body>
<!-- Start your code here -->

<tr align="right">
<td colspan="3" class="noBorder">

<b><font size="4px;">Subtotal<br>Tax (%)
</font></b>
</td>

<td valign="middle" align="center" width="100%">
<input type="text" id="subtotal" name="subtotal" class="subtotal" value="1.00"       style="border:none;width: 100%;"/>
<input type="text" id="tax" class="tax" name="tax" style="border:none;width: 100%;">
</td>
<td valign="middle" align="center" width="100%">
<input type="text" id="subtotal" name="subtotal" class="subtotal" value="5.00"       style="border:none;width: 100%;"/>
<input type="text" id="tax" class="tax" name="tax" style="border:none;width: 100%;">
</td>
<td valign="middle" align="center" width="100%">
<input type="text" id="subtotal" name="subtotal" class="subtotal" value="a"       style="border:none;width: 100%;"/>
<input type="text" id="tax" class="tax" name="tax" style="border:none;width: 100%;">
</td>
<td valign="middle" align="center" width="100%">
<input type="text" id="subtotal" name="subtotal" class="subtotal" value="4.00"       style="border:none;width: 100%;"/>
<input type="text" id="tax" class="tax" name="tax" style="border:none;width: 100%;">
</td>
</tr>

<script>
var subTotal=document.getElementsByClassName("subtotal");
var n=[];
for(var i=0;i<subTotal.length;i++){
if(subTotal[i].value===''){
subTotal[i].value=0;
}
n.push(parseInt(subTotal[i].value));
var total=0;
for(var i in n) { total += n[i]; }

});

}
</script>
<!-- End your code here -->
</body>
</html>
``````
1
Commented:
1. Highlight code
2. Click the CODE button in the toolbar

Please post more of your code - you have left out some key bits (the select's, the line items) these are important to solving the problem.

I expect that there is a much simpler solution to your problem - your JavaScript code is overly verbose - but to give you correct code we need a proper context.

If you have a link to a sample page that would be first prize.
1

Experts Exchange Solution brought to you by

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Commented:
hope this helps

``````<!DOCTYPE html>
<html>
<title>HTML, CSS and JavaScript demo</title>
<body>
<!-- Start your code here -->

<table>
<tr>
<td>Quantity</td>
<td>Unit Price</td>
<td>Total</td>
</tr>
<tr>
<td>5</td>
<td>5</td>
<td class="val">25</td>
</tr>
<tr>
<td>5</td>
<td>5</td>
<td class="val">25</td>
</tr>
<tr>
<td>5</td>
<td>5</td>
<td class="val">25</td>
</tr>
<tr>
<td colspan="2" id="tot" >Total</td>
</tr>
</table>
<input type="button" name="abc" id="abc" value="click" onclick="calculate()" />
<script>
function calculate()
{
var html = document.querySelectorAll(".val");
var tot = 0;
for (i = 0; i < html.length; ++i) {
tot = tot + parseInt(html[i].innerHTML);
}

document.getElementById("tot").innerHTML = tot;
}

</script>
<!-- End your code here -->
</body>
</html>
``````
1
PHP Web DeveloperAuthor Commented:
It's working Thank you all
0
###### It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Development

From novice to tech pro — start learning today.