Sunday, December 11, 2016

Product Cost Solver in JavaScript

In this article I would like to share with you a sample program to compute the cost of the product using JavaScript.The code is very simple and easy to understand.

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>
<head>
<title> Product Cost 1.0
</title>
</title>
<body bgcolor="lightgreen">
<font color="Blue" face="Arial" size="5">
<center>
<br>
Product Cost Solver Version 1.0
<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"> <label for="val1"> Enter Product Name
</label></td>
<td> <input type="text" name="name"  size="40"/> </td>
</tr>
<tr>
<td class="labelText"> <label for="val2"> Enter Product Price
</label></td>
<td> <input type="text" name="price" size="20"/> </td>
</tr>
<tr>
<td class="labelText"> <label for="val3"> Enter Product Quantity
</label></td>
<td> <input type="text" name="quantity"  size="20"/> </td>
</tr>
 <tr>
 <td> &nbsp; </td>
<tr>
<td class="labelText"> <label for="sum"> Total Product Cost
</label></td>
<td> <input type="text" name="cost" size="20"/> </td>
</tr>
 <tr>
 <td> &nbsp; </td>
</tr>
<td> <input type="button" value="Compute Cost" 
name="btnSubmit" onClick="add()">
</td> 
<td> <input type="button" value="Clear Textbox" 
name="btnSubmit" onClick="clear_all()">
</td> 

</table>
</font>
</form>

<script language ="javascript">

function add()
{
var xval1, xval2, compute, final_result;
  
xval1 = parseFloat(document.addval.price.value);
xval2 = parseInt(document.addval.quantity.value);

compute = (xval1 * xval2);
// For two decimal places convertion
final_result = Math.round(compute * 100) /100;

document.addval.cost.value = "Php " +final_result;
}

function clear_all()
{
document.addval.name.value = "";
document.addval.price.value = "";
document.addval.quantity.value = "";
document.addval.cost.value = "";
document.addval.name.focus(); 
}
</script>


</body>
</html>





No comments:

Post a Comment