asked on

Calculation Not working in JS !

I was trying to calculate with sub-total, tax, discount, Packing / Delivery Charges & total.,

This Js code works fine without adding / including (discount, Packing / Delivery Charges)

Js working code :

function calculateTotal(){
	subTotal = 0 ; total = 0; 
	$('.totalLinePrice').each(function(){
		if($(this).val() != '' )subTotal += parseFloat( $(this).val() );
	});
	$('#subTotal').val( subTotal.toFixed(2) );
	
	tax = $('#tax').val(); 
	
		
	if(tax != '' && typeof(tax) != "undefined" ){
		taxAmount = subTotal * ( parseFloat(tax) /100 );
		$('#taxAmount').val(taxAmount.toFixed(2));
		total = subTotal + taxAmount;
	}else{
		$('#taxAmount').val(0);
		total = subTotal;
	}
	
	
	
	$('#totalAftertax').val( total.toFixed(2) );
	calculateAmountDue();
		
}

Open in new window

When i add discount, Packing / Delivery Charges functionality it doesn't

function calculateTotal(){
	subTotal = 0 ; total = 0;  
	
	//packing_delivery = 0; discount = 0;
	$('.totalLinePrice').each(function(){
		if($(this).val() != '' )subTotal += parseFloat( $(this).val() );
	});
	$('#subTotal').val( subTotal.toFixed(2) );
	
	var tax = $('#tax').val(); 
	var packing_delivery = $('#invoice_packing_delivery_charges').val(); 
	var discount = $('#discount').val(); 
	
		
	if(tax != '' && typeof(tax) != "undefined" ){
		
		taxAmount = subTotal * ( parseFloat(tax) /100 );
		$('#taxAmount').val(taxAmount.toFixed(2));
//$('#invoice_packing_delivery_charges').val(packing_delivery); // added
	//	$('#discount').val(discount); // added
		
		
		
		total = subTotal + taxAmount + invoice_packing_delivery_charges + discount;
	}else{
		$('#taxAmount').val(0);
		//$('#invoice_packing_delivery_charges').val(0);
		//$('#discount').val(0);
		//total = subTotal;
		total = subTotal + taxAmount + invoice_packing_delivery_charges + discount;
	}
	
	alert(invoice_packing_delivery_charges);
	alert(subTotal);
	alert(taxAmount);
	
	$('#totalAftertax').val( total.toFixed(2) );
	calculateAmountDue();
		
}

Open in new window

The HTML code for this.,

<div class="col-lg-12">	
								<div class="col-lg-6">
                                    <div class="table-responsive">
                                        <table class="table table-bordered table-hover table-striped">
                                            <thead>
                                                <tr>
                                                  <!--  <th>#</th>
                                                    <th>Date</th>
                                                    <th>Time</th>
                                                    <th>Amount</th> -->
                                                </tr>
                                            </thead>
                                            <tbody>
												
                                                
                                                <tr>
                                                    <td> <span style="float:left;">Tax &nbsp; </span>
														<select class="form-control" name="tax_percent" id="tax" placeholder="Tax" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" >
															 <?php echo $options; ?>
														</select>
														</td>
                                                    <td>
													<input type="number" class="form-control" name="tax_value" id="taxAmount" placeholder="Tax" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" readonly>
													</td>
													
                                                </tr>
                                                <tr>
                                                    <td>Packing / Delivery Charges</td>
                                                    <td><input type="number" id="invoice_packing_delivery_charges" name="invoice_packing_delivery_charges" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" value="0"></td>
                                                </tr>
                                                
                                                <!--
												<tr>
                                                    <td>Quotation Delivery</td>
                                                    <td><input type="text" name="quotation_delivery"></td>
                                                </tr> -->
												
												<tr>
                                                    <td>Remarks</td>
                                                    <td><input type="text" name="invoice_remarks"></td>
                                                </tr>
												
												
												
                                            </tbody>
                                        </table>
                                    </div>



<div class="col-lg-6">
                                    <div class="table-responsive">
                                        <table class="table table-bordered table-hover table-striped">
                                            <thead>
                                                <tr>
                                                  <!--  <th>#</th>
                                                    <th>Date</th>
                                                    <th>Time</th>
                                                    <th>Amount</th> -->
                                                </tr>
                                            </thead>
                                            <tbody>
												
												<tr>
                                                    <td>Sub Total</td>
                                                    <td><input type="text" id="subTotal" name="invoice_sub_total" placeholder="Subtotal" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>
                                                </tr>
												<tr>
                                                    <td>Discount (if Any)</td>
                                                    <td><input type="text" id="discount" name="invoice_discount" placeholder="in Rupees"></td>	
												<!--<tr>
                                                    <td>Transport Charges</td>
                                                    <td><input type="text" name="quotation_transport_charges"></td>
                                                </tr>-->
                                                <tr>
                                                    <td>Total</td>
                                                    <td><input type="number" class="form-control" name="invoice_total" id="totalAftertax" placeholder="Total" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>
                                                </tr>
                                                
                                                
												
                                            </tbody>
                                        </table>
                                    </div>

Open in new window

Member_2_248744

greetings mani gopal , , I looked at your javascript, and you have a NON Working variable in your javascript as -
invoice_packing_delivery_charges
this is an input ID , NOT a variable in your code, so the javascript will NOT work with that "undefined" variable.
You need to change this variable to -
packing_delivery

Here is some changes that work for me -

  var tax = $('#tax').val();
  var packing_delivery = $('#invoice_packing_delivery_charges').val();
  var discount = $('#discount').val();
      
            
if(tax && (tax != "0") ){
   var taxAmount = subTotal * ( parseFloat(tax) /100 );
   $('#taxAmount').val(taxAmount.toFixed(2));
   total = subTotal + taxAmount + packing_delivery - discount;
 }else{
   $('#taxAmount').val(0);
   total = subTotal + packing_delivery - discount;
 }
$('#totalAftertax').val( total.toFixed(2) );      
      alert(packing_delivery);

Open in new window

I am Not sure about HOW you use your discount, BUT I changed it to minus the discount instead of adding the discount? ?

mani gopal

ASKER

@Slick812

Thanks for the reply still its not working.,

Here is the code after modification.,

function calculateTotal(){
      subTotal = 0 ; total = 0;

      //packing_delivery = 0; discount = 0;
      $('.totalLinePrice').each(function(){
            if($(this).val() != '' )subTotal += parseFloat( $(this).val() );
      });
      $('#subTotal').val( subTotal.toFixed(2) );

      var tax = $('#tax').val();
      var packing_delivery = $('#invoice_packing_delivery_charges').val();
      var discount = $('#discount').val();


      if(tax && (tax != "0") ){

            var taxAmount = subTotal * ( parseFloat(tax) /100 );
            $('#taxAmount').val(taxAmount.toFixed(2));
//$('#invoice_packing_delivery_charges').val(packing_delivery); // added
      //      $('#discount').val(discount); // added
            total = subTotal + taxAmount + packing_delivery - discount;
      }else{
            $('#taxAmount').val(0);
            //$('#invoice_packing_delivery_charges').val(0);
            //$('#discount').val(0);
            //total = subTotal;
            total = subTotal + packing_delivery - discount;
      }

      //alert(packing_delivery);
      //alert(subTotal);
      //alert(taxAmount);

      $('#totalAftertax').val( total.toFixed(2) );
      calculateAmountDue();

}

PFA : JS & PHP file (Original)
auto_invoice.js
invoice_add.php

ASKER CERTIFIED SOLUTION

Member_2_248744

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Member_2_248744

This question has been inactive for more than 14 days, and Must be closed for cleanup. Points awarded to code that does addition calculations.