Sunday, December 11, 2016

Addition of Two Numbers in JavaScript

Here is a sample program that I wrote a very long time ago while I'm teaching web programming in college. The program will ask the user to give two numbers and our program will find the sum of two numbers using JavaScript I am using HTML forms to accept values from the user.  I hope you will find my work useful. Thank you.

Add me at Facebook my address is jakerpomperada@gmail.com and jakerpomperada@yahoo.com

My email address are the following jakerpomperada@gmail.com and jakerpomperada@yahoo.com

My mobile number here in the Philippines is 09173084360.



Sample Program Output


Program Listing

<html>
<title> Sum of Two Numbers
</title>
<body bgcolor="lightgreen">
<font color="black" face="Arial" size="5">
<center>
<br>
Sum of Two Numbers
<br>
</center>
</font>
<style type="text/css">
.labelText {
 text-align : right;
 padding-right : 3px;
}
</style>
<form  name="addval" method="post">
<font color="black" face="Arial" size="5">
<table>
<tr>
<td class="labelText">  Enter Value No. 1
</td>
<td> <input type="text" name="val1"  size="10"/> </td>
</tr>
<tr>
<td class="labelText">  Enter Value No. 2
</td>
<td> <input type="text" name="val2" size="10"/> </td>
</tr>
 <td> &nbsp; </td>
<tr>
<td class="labelText">  The Total Sum is
</td>
<td> <input type="text" name="sum" size="10"/> </td>
</tr>
 <tr>
 <td> &nbsp; </td>
 </tr>
<td> <input type="button" value="Compute" 
title="Click here to find the sum."
 onClick="add()">
</td> 
<td> <input type="button" value="Clear" 
title="Click here to clear the text box."
 onClick="clear_all()">
</td> 

</table>
</font>
</form>
<script language ="javascript">
function add()
{
var xval1, xval2, xsum;
  
xval1 = parseInt(document.addval.val1.value);
xval2 = parseInt(document.addval.val2.value);

xsum = (xval1 + xval2);

document.addval.sum.value = xsum;
}

function clear_all()
{
document.addval.val1.value = "";
document.addval.val2.value = "";
document.addval.sum.value = "";
document.addval.val1.focus(); 
}
</script>
</body>
</html>








No comments:

Post a Comment