Q:

locally add javascript to xampp to do math/formula

I'm trying to make a table, in which user can fill some cells with values and then click submit to show the calculation result. I have jquery-2.0.3.min.js and script.js in my directory. Here is my HTML code:
<!DOCTYPE html>
<html>
<head>
<title>Inteligence Decision Support System</title>
<script src='localhost/idss/jquery-2.0.3.min.js'></script>
<script type="text/javascript" src='localhost/idss/script.js' charset="utf-8"></script>
</head>

<body>
<table border="1">

<tr>
<th>Name</th>
<th>Cost</th>
<th>x20</th>
<th>x25</th>
</tr>

<tr>
<td>someName</td>
<td><input name="Cost" type="text" value="0"></td>
<td><input name="a20" type="text" value=""></td>
<td><input name="a25" type="text" value=""></td>
</tr>

</table>
<input type="button" onclick="Zcount()" value="Submit" >
</body>
</html>

and here is the script.js file
<script type="text/javascript">
function Zcount(){
    var cost, a20, a25;

    a20 = document.getElementById("a20").value;
    a25 = document.getElementById("a25").value;

    cost = (2*parseInt(a20))+(3*parseInt(a25));
    document.getElementById("Cost").value=cost;
}
</script>

but when I filled a20 and a25 and click the submit button, nothing happened. The result stayed zero. Where did I go wrong?

A:

You have to check if the external javascripts are actually loaded. You can do this by right-clicking in he browser ind click "inspect element" in chrome or firefox. If you click "console" in these inspectors you can check if they are loaded. If they aren't, you have to adjust your src attribute in the HTML script element.
Also, you have to use the id attribute on the input's because you're using getElementById, and officially inputs have to be surrounded by a form element. So, in the body tag, your HTML will be like this:
<form id="form" action="#" method="post">
<table border="1">

<tr>
<th>Name</th>
<th>Cost</th>
<th>x20</th>
<th>x25</th>
</tr>

<tr>
<td>someName</td>
<td><input name="Cost" id="Cost" type="text" value="0"></td>
<td><input name="a20" id="a20" type="text" value=""></td>
<td><input name="a25" id="a25" type="text" value=""></td>
</tr>

</table>
<input type="submit" value="Submit" >
    </form>

Inside the script.js, you don't have to use the HTML script tags.
Why are u including jquery if you don't use it?
But because you do, you can use this script:
$('form').submit(function(){

    var cost, a20, a25;

    a20 = $("#a20").val();
    a25 = $("#a25").val();

    cost = (2*parseInt(a20))+(3*parseInt(a25));
    $("#Cost").val(cost);
    return false;
});

Working jsFiddle: http://jsfiddle.net/jwvanveelen/ch2wR/

