Javascript Automatic total Generate in Invoice

satish dodia 02:55:00
JavaScript Automatic total Generate in Invoice
on-focus mathode


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>MementoTech</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap-table.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<link rel="stylesheet" href="css/footer-basic-centered.css">
<script src="js/jquery-1.11.1.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="js/bootstrap.min.js"></script>

</head>
<body>
<?php include 'navbar.html'; ?>
<div class="row">

<div class="col-sm-1">

</div>
<div class="col-sm-7">
<form class"form-horizontal" role="form" method="post" action="upload_lr.php"><!-- form starts here -->
<div class="input-group">
<div class="form-group col-sm-12">
<div class="form-group col-xs-4">
   <label for="lrno">LR No.</label>
   <input type="text" name="lrno" class="form-control" id="lrno" value="">
</div>
<div class="form-group col-xs-4">
<label for="lrdate">Date</label>
<input type="text" name="lrdate" class="form-control" id="lrdate" value="">
</div>
<div class="form-group col-xs-4">
<label for="lrtime">Time</label>
<input type="text" name="lrtime" class="form-control" id="lrtime" value="">
</div>
</div> <!-- div col-sm-12 ends here -->
<div class="form-group col-md-12">
<div class="form-group col-xs-4">
<label for="paymentype">Payment Type</label>
<select name="payment_type" class="form-control" id="paymenttype">
<option>To Pay</option>
<option>Paid</option>
<option>TBB</option>
</select>
</div>
<div class="form-group col-xs-3">
<label for="consignor">Consignor <span style="color: red;">*</span></label>
<select name="consignor" class="form-control" id="consignor">


</select>
</div>

<div class="form-group col-xs-3">
<label for="consignee">Consignee <span style="color: red;">*</span></label>
<select name="consignee" class="form-control" id="consignee">

</select>
</div>


</div><!-- div col-sm-12 ends here -->
<div class="col-sm-12">

<div class="form-group col-xs-4">
<label for="station">Select Station <span style="color: red;">*</span></label>
<select name="station" class="form-control" id="station">

</select>
</div>

<div class="form-group col-xs-4">
<label for="atstation">Select At Station <span style="color: red;">*</span></label>
<select name="atstation" class="form-control" id="atstation">

</select>
</div>

</select>
</div> -->

<div class="form-group col-xs-6">
<label for="remarks">Remarks</label>
<input type="text-area" name="remarks" class="form-control" id="lrremarks" placeholder="Enter Remarks">
</div>
<div class="form-group col-xs-4">
<label for="mobile_no">Mobile No <span style="color: red;">*</span></label>
<input type="text" name="mobile_no" class="form-control" id="lrmobile_no" placeholder="Enter Mobile No." required>
</div>

</div> <!-- div col-sm-12 ends here -->
<div class="form-group col-sm-10">
<div class="col-xs-6">
<label class="checkbox-inline"><input name="payment1" type="checkbox" value="C.C. At.">C.C. At.</label>
<label class="checkbox-inline"><input name="payment2" type="checkbox" value="D.D">D.D</label>
<label class="checkbox-inline"><input name="payment3" type="checkbox" value="Paid Put Balance">Paid Put Balance</label>
</div>
</div> <!-- div col-sm-12 ends here -->

</div>
</div>
<div class="col-sm-3">
<div class="table-responsive">
<table class="table table-bordered">
<tr><td><strong>Gross Total <span style="color: red;">*</span></strong></td><td><input name="gtotal_rate" onfocus="javascript:addNumbers1()" id="answer" type="number" class="form-control"  required /></td></tr>
<tr><td><strong>H</strong></td><td><input name="h_rate" type="number" id="h_rate"  class="form-control" /></td></tr>
<tr><td><strong>D.C</strong></td><td><input name="dc_rate" type="number" id="dc_rate" class="form-control" /></td></tr>
<tr><td><strong>D.D</strong></td><td><input name="dd_rate" type="number" id="dd_rate" class="form-control" /></td></tr>
<tr><td><strong>Service Tax</strong></td><td><input name="stax_rate" type="number" id="stax_rate" class="form-control" /></td></tr>
<tr><td><strong>Total <span style="color: red;">*</span></strong></td><td><input name="total_rate"  onfocus="javascript:addNumbers()" type="number" id="total_rate" class="form-control"  required /></td></tr>
</table>

</div>
<hr>
<div class="container">
<button type="submit" name="submit" id="" class="btn btn-primary">Save LR</button>
<button type='reset' name="reset" class="btn btn-danger">Reset</button>
<button type="button" name="calculate" id="" class="btn btn-info" >Calculate</button>
</div>
<hr>


</div> <!-- div col-sm-3 ends here-->

<div class="col-sm-1">

</div>


<div class="container">
<div class="input-group">
<!-- <form class="form-group form-horizontal" action="" method="post"><! form starts here - -->
<div class="container">
<div class="form-group col-xs-2 row">
<label for="item">Item</label>
<input type="text" name="item[]" class="form-control" id="item" placeholder="Enter Item" >
</div>

<div class="form-group col-xs-2 row">
<label for="invoice_no">Invoice No.</label>
<input type="text" name="invoice_no[]" class="form-control" id="lrinvoiceno" placeholder="Enter Invoice No." >
</div>
<div class="form-group col-xs-2 row">
<label for="content_type">Content Type</label>
<input type="text" name="content_type[]" class="form-control" id="lrcontenttype" placeholder="Enter Content Type" >
</div>

<div class="form-group col-xs-2 row">
<label for="rate">Rate</label>
<input type="text" name="rate[]" class="form-control" id="lrrate1" placeholder="Enter Rate" >
</div>
<div class="form-group col-xs-2 row">
<label for="weight">Weight</label>
<input type="text" name="weight[]" class="form-control" id="lrweight" placeholder="Enter Weight" >
</div>
<div class="form-group col-xs-2 row">
<label for="rateasper">Rate As Per</label>
<select name="rate_as_per[]" class="form-control" id="lrrateasper">
<option>Nos</option>
<option>Weight</option>
</select>
</div>
<div class="form-group col-xs-2 row">
<label for="no_of_items">Nos</label>
<input type="text" name="no_of_items[]" class="form-control" id="lrnoofitems1" placeholder="Enter No of Items"  >
</div>

</div>


<!-- </form> <!-form ends here -> -->
</div>
</div>
<div class="container">
<div class="input-group">
<!-- <form class="form-group form-horizontal" action="" method="post"><! form starts here - -->
<div class="container">
<div class="form-group col-xs-2 row">
<label for="item">Item</label>
<input type="text" name="item[]" class="form-control" id="item" placeholder="Enter Item" >
</div>

<div class="form-group col-xs-2 row">
<label for="invoice_no">Invoice No.</label>
<input type="text" name="invoice_no[]" class="form-control" id="lrinvoiceno" placeholder="Enter Invoice No." >
</div>
<div class="form-group col-xs-2 row">
<label for="content_type">Content Type</label>
<input type="text" name="content_type[]" class="form-control" id="lrcontenttype" placeholder="Enter Content Type" >
</div>

<div class="form-group col-xs-2 row">
<label for="rate">Rate</label>
<input type="text" name="rate[]" class="form-control" id="lrrate2" placeholder="Enter Rate" >
</div>
<div class="form-group col-xs-2 row">
<label for="weight">Weight</label>
<input type="text" name="weight[]" class="form-control" id="lrweight" placeholder="Enter Weight" >
</div>
<div class="form-group col-xs-2 row">
<label for="rateasper">Rate As Per</label>
<select name="rate_as_per[]" class="form-control" id="lrrateasper">
<option>Nos</option>
<option>Weight</option>
</select>
</div>
<div class="form-group col-xs-2 row">
<label for="no_of_items">Nos</label>
<input type="text" name="no_of_items[]" class="form-control" id="lrnoofitems2" placeholder="Enter No of Items" >
</div>

</div>


<!-- </form> <!-form ends here -> -->
</div>
</div>
<div class="container">
<div class="input-group">
<!-- <form class="form-group form-horizontal" action="" method="post"><! form starts here - -->
<div class="container">
<div class="form-group col-xs-2 row">
<label for="item">Item</label>
<input type="text" name="item[]" class="form-control" id="item" placeholder="Enter Item" >
</div>

<div class="form-group col-xs-2 row">
<label for="invoice_no">Invoice No.</label>
<input type="text" name="invoice_no[]" class="form-control" id="lrinvoiceno" placeholder="Enter Invoice No." >
</div>
<div class="form-group col-xs-2 row">
<label for="content_type">Content Type</label>
<input type="text" name="content_type[]" class="form-control" id="lrcontenttype" placeholder="Enter Content Type" >
</div>

<div class="form-group col-xs-2 row">
<label for="rate">Rate</label>
<input type="text" name="rate[]" class="form-control" id="lrrate3" placeholder="Enter Rate"  >
</div>
<div class="form-group col-xs-2 row">
<label for="weight">Weight</label>
<input type="text" name="weight[]" class="form-control" id="lrweight" placeholder="Enter Weight" >
</div>
<div class="form-group col-xs-2 row">
<label for="rateasper">Rate As Per</label>
<select name="rate_as_per[]" class="form-control" id="lrrateasper">
<option>Nos</option>
<option>Weight</option>
</select>
</div>
<div class="form-group col-xs-2 row">
<label for="no_of_items">Nos</label>
<input type="text" name="no_of_items[]" class="form-control" id="lrnoofitems3" placeholder="Enter No of Items" >
</div>

</div>

<script language="javascript">
                function addNumbers()
                {
                        var val1 = parseInt(document.getElementById("lrrate1").value);
                        var val2 = parseInt(document.getElementById("lrrate2").value);

                         var val3 = parseInt(document.getElementById("lrrate3").value);

                         var val4 = parseInt(document.getElementById("lrnoofitems3").value);

                         var val5 = parseInt(document.getElementById("lrnoofitems2").value);
var val6 = parseInt(document.getElementById("lrnoofitems1").value);
var val7 = parseInt(document.getElementById("h_rate").value);
var val8 = parseInt(document.getElementById("dc_rate").value);
var val9 = parseInt(document.getElementById("dd_rate").value);
var val10 = parseInt(document.getElementById("stax_rate").value);
                        var ans = document.getElementById("total_rate");
                        ans.value = (val1*val6) + (val2*val5) + (val4*val3)  + val7 + val8 + val10 + val9;

 }
function addNumbers1()
{
var val1 = parseInt(document.getElementById("lrrate1").value);
var val2 = parseInt(document.getElementById("lrrate2").value);

 var val3 = parseInt(document.getElementById("lrrate3").value);

 var val4 = parseInt(document.getElementById("lrnoofitems3").value);

 var val5 = parseInt(document.getElementById("lrnoofitems2").value);
var val6 = parseInt(document.getElementById("lrnoofitems1").value);
var ans = document.getElementById("answer");

 ans.value = (val1*val6) + (val2*val5) + (val4*val3);

 }

         </script>


<!-- </form> <!-form ends here -> -->
</div>
</div>
</form><!-- form ends here -->
</div>

</body>
</html>

Reactions

Post a Comment

0 Comments

Recent in Recipes

3/Food/post-list