javascript - How to add numbers automatically by entering -
i have form has many fields. in these fields there payment fields starting payment1 payment12. whenever values input these fields should perform addition of values automatically. @ times user might enter few fields or may of them.
the problem until input values fields not sum below code:
<?php require_once('../../admin panel/db.php'); $remoteemployeeid = $_get['remoteemployeeid']; ?> <!doctype html> <html lang="en-us"> <head> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> <script> $(document).ready(function() { $("#datepicker1, #datepicker2, #datepicker3, #datepicker4, #datepicker5, #datepicker6, #datepicker7, #datepicker8, #datepicker9, #datepicker10, #datepicker11, #datepicker12").datepicker(); }); </script> <script type="text/javascript"> function transaction() { var amountearned = parseint(document.transactionform.amountearned.value); var taxdeduction = parseint(document.transactionform.taxdeduction.value); var totalreceivedtodate = parseint(document.transactionform.totalreceivedtodate.value); var amountremainwithoffice = parseint(document.transactionform.amountremainwithoffice.value); var paymentsreceived1 = parseint(document.transactionform.paymentsreceived1.value); var paymentsreceived2 = parseint(document.transactionform.paymentsreceived2.value); var paymentsreceived3 = parseint(document.transactionform.paymentsreceived3.value); var paymentsreceived4 = parseint(document.transactionform.paymentsreceived4.value); var paymentsreceived5 = parseint(document.transactionform.paymentsreceived5.value); var paymentsreceived6 = parseint(document.transactionform.paymentsreceived6.value); var paymentsreceived7 = parseint(document.transactionform.paymentsreceived7.value); var paymentsreceived8 = parseint(document.transactionform.paymentsreceived8.value); var paymentsreceived9 = parseint(document.transactionform.paymentsreceived9.value); var paymentsreceived10 = parseint(document.transactionform.paymentsreceived10.value); var paymentsreceived11 = parseint(document.transactionform.paymentsreceived11.value); var paymentsreceived12 = parseint(document.transactionform.paymentsreceived12.value); var result = (amountearned * taxdeduction) / 100; var result1 = amountearned-result; var result2 = (paymentsreceived1 + paymentsreceived2 + paymentsreceived3 + paymentsreceived4 + paymentsreceived5 + paymentsreceived6 + paymentsreceived7 + paymentsreceived8 + paymentsreceived9 + paymentsreceived10 + paymentsreceived11) + paymentsreceived12; var result3 = (totalreceivedtodate - result2); document.transactionform.tax.value = result; document.transactionform.totalearnaftertax.value = result1; document.transactionform.totalreceivedtodate.value = result2; document.transactionform.amountremainwithoffice.value = result3; } </script> <style> table { border-top:1px solid #e5eff8; border-right:1px solid #e5eff8; border-left:1px solid #e5eff8; border-bottom:1px solid #e5eff8; margin:1em auto; border-collapse:collapse; font-family:"verdana"; } td { color:#678197; border-bottom:1px solid #e5eff8; border-top:1px solid #e5eff8; border-left:1px solid #e5eff8; } body,td,th { color: #000000; } </style> <title>remote employee detailed information</title> </head> <body> <form action="remote employee transaction history_exe.php?remoteemployeeid=<?php echo $remoteemployeeid ?>" name="transactionform" method="post"> <table width="789" height="966" border="0" cellpadding="3" style="font-family:verdana; margin-top:30px;" bgcolor="#cccccc"> <tr> <td height="99" colspan="2" align="left" valign="middle" > <p><font size="+3"> remote employee transaction history </font></p> </td> </tr> <tr> <td width="35%" >amount earned:</td> <td width="65%" ><input type="number" id="amountearned" name="amountearned" onchange="transaction()" required ></td> </tr> <tr> <td >tax deduction:</td> <td ><select name="taxdeduction" id="taxdeduction" onchange="transaction()" required="required" style="width:153px;" ><br /> <option selected="selected" disabled="disabled" value=""> tax deduction</option> <option value="2"> two percent</option> <option value="7"> seven percent</option> <option value="10"> ten percent</option> </select></td> </tr> <tr > <td >deducted tax amount:</td> <td ><input size="3" readonly type="nubmer" id="tax" name="tax" style="text-align:center;" ></td> </tr> <tr style="border-bottom:6px #ffffff solid;"> <td > total earned after tax:</td> <td ><input type="number" id="totalearnaftertax" name="totalearnaftertax" required > </td> </tr> <tr> <td colspan="2" align="center" ><h3>processed records</h3></td> </tr> <tr> <td >property id:</td> <td ><textarea cols="35" rows="6" name="propertyid"></textarea></td> </tr> <tr> <td colspan="2" align="center" ><h3>payments received</h3></td> </tr> <tr> <td >payment 1: <input name="date1" type="date" id="datepicker1"></td> <td ><input type="number" name="paymentsreceived1" onchange="transaction()" ></td> </tr> <tr> <td >payment 2: <input type="date" name="date2" id="datepicker2"></td> <td ><input type="number" name="paymentsreceived2" onchange="transaction()" ></td> </tr> <tr> <td >payment 3: <input type="date" name="date3" id="datepicker3"></td> <td ><input type="number" name="paymentsreceived3" onchange="transaction()" ></td> </tr> <tr> <td >payment 4: <input type="date" name="date4" id="datepicker4"></td> <td ><input type="number" name="paymentsreceived4" onchange="transaction()" ></td> </tr> <tr> <td >payment 5: <input type="date" name="date5" id="datepicker5"></td> <td ><input type="number" name="paymentsreceived5" onchange="transaction()" ></td> </tr> <tr> <td >payment 6: <input type="date" name="date6" id="datepicker6"></td> <td ><input type="number" name="paymentsreceived6" onchange="transaction()" ></td> </tr> <tr> <td >payment 7: <input type="date" name="date7" id="datepicker7"></td> <td ><input type="number" name="paymentsreceived7" onchange="transaction()" ></td> </tr> <tr> <td >payment 8: <input type="date" name="date8" id="datepicker8"></td> <td ><input type="number" name="paymentsreceived8" onchange="transaction()" ></td> </tr> <tr> <td >payment 9: <input type="date" name="date9" id="datepicker9"></td> <td ><input type="number" name="paymentsreceived9" onchange="transaction()" ></td> </tr> <tr> <td >payment 10: <input type="date" name="date10" id="datepicker10"></td> <td ><input type="number" name="paymentsreceived10" onchange="transaction()" ></td> </tr> <tr> <td >payment 11: <input type="date" name="date11" id="datepicker11"></td> <td ><input type="number" name="paymentsreceived11" onchange="transaction()" ></td> </tr> <tr style="border-bottom:6px #ffffff solid;"> <td >payment 12: <input type="date" name="date12" id="datepicker12"></td> <td ><input type="number" name="paymentsreceived12" onchange="transaction()" ></td> </tr> <tr> <td >total received date:</td> <td ><input type="text" id="totalreceivedtodate" name="totalreceivedtodate" required onchange="transaction()" ></td> </tr> <tr> <td >remaining amount office:</td> <td ><input type="number" id="amountremainwithoffice" name="amountremainwithoffice" ></td> </tr> <tr> <td ><input type="submit" value="submit database" style=" font: 15px verdana; text-decoration: none; background-color: #eeeeee; color: #333333; padding: 2px 6px 2px 6px; border-top: 1px solid #cccccc; border-right: 1px solid #333333; border-bottom: 1px solid #333333; border-left: 1px solid #cccccc; cursor:pointer;"></td> <td ><a href="more remote employees.php?remoteemployeeid=<?php echo $remoteemployeeid ?>" style=" font: 15px verdana; text-decoration: none; background-color: #eeeeee; color: #333333; cursor:pointer; padding: 2px 6px 2px 6px; border-top: 1px solid #cccccc; border-right: 1px solid #333333; border-bottom: 1px solid #333333; border-left: 1px solid #cccccc; ">back information</a></td> </tr> </table> </form> </body> </html>
how use below,
var paymentsreceived1 = number(document.transactionform.paymentsreceived1.value); 
Comments
Post a Comment