Click here to Skip to main content
15,923,273 members
Please Sign up or sign in to vote.
1.00/5 (2 votes)
See more:
I have created a dynamic calculator on my wordpress site but when i change the value from dropdown it reset the other values.
My script code is as following.

What I have tried:

(function ($) {
	
   
	 update_amounts();
    $('.package').change(function() {
        update_amounts();
		 $('#myTable > tbody  > tr > td.numbers-row ').each(function() {
	 $(this).find("input").val();
	 //$(this).find("input").val(1); //val(1) is ued to reset the qty buttons
	 });
    });
	//reset all options 
    $("#reset").on("click", function () {
    $('#package_id option').prop('selected', function() {
        return this.defaultSelected;
    });
	update_amounts();
	 $('#myTable > tbody  > tr > td.numbers-row ').each(function() {
	 $(this).find("input").val(1);
	 });
    });


function update_amounts()
{
    var sum = 0.0;
    $('#myTable > tbody  > tr').each(function() {
       	  var package;
  
       // var qty = $(this).find('option:selected').val();
        var price = $(this).find('.price').val();
		
		if ($(this).find('#package_id').length){
			package =  $(this).find('option:selected').val();
	   if(package=="" || package=="none" ){
       package =  $(this).find('.price').val();
		}
		}
		else{
			 package =  $(this).find('.price').val();
		}
        
        sum += parseInt(package);
		$(this).find('.price').val(package);
        $(this).find('.amount').text(''+package);
    });
    //just update the total to sum  
    $('.total').text(sum);
    
}



}) (jQuery);


 (function ($) {
$( "<div class='inc button'>+</div>" ).insertAfter( ".numbers-row input#french-hens" );
$( "<div class='dec button'>-</div>" ).insertBefore( ".numbers-row input#french-hens" );
  //$(".numbers-row").append('<div class="dec button">-</div>');
function calcProdSubTotal() {
    var sum=0;
       $('#myTable > tbody  > tr').each(function() {
       	  var package; 
  
       // var qty = $(this).find('option:selected').val();
		
			 package =  $(this).find('.amount').text();
		
        
        sum += parseInt(package);
		//alert(sum);
        //$(this).find('.amount').text(''+package);
    });
$('.total').text(sum);
   // $("#product-subtotal").val(CommaFormatted(prodSubTotal));

}
  $(".button").on("click", function() {

    var $button = $(this);
	var sum=0;var product_val;
    var oldValue = $button.parent().find("input").val();
 var total_amt =
            $button.parent().parent()
            .find("td .price")
            .val();
			//alert(total_amt);
    if ($button.text() == "+") {
  	  var newVal = parseFloat(oldValue) + 1;
	  total_cal= newVal * total_amt;
	 product_val=$button.parent().parent()
            .find("td span")
            .text(total_cal);
  	} else {
	   // Don't allow decrementing below zero
      if (oldValue > 0) {
        var newVal = parseFloat(oldValue) - 1;
		total_cal= newVal * total_amt;
	 product_val=$button.parent().parent()
            .find("td span")
            .text(total_cal);
	    } else {
        newVal = 0;
			
      }
	  
	  }
	   var calculate= $button.parent().find("input").val(newVal); 
	   calcProdSubTotal();
	
	   
  });

  
 
  
  
  
  
  
}) (jQuery);
Posted
Comments
F-ES Sitecore 5-Sep-18 9:00am    
Without knowing the mark-up it's impossible help. And that was not a request for you to dump 1,000 lines of HTML too. You need to learn how to debug your code, how to set breakpoints and step through it in the browser dev tools to get an idea what is happening. If the whole form is resetting then the first thing I'd check is that the whole page isn't just being refreshed.
ZurdoDev 5-Sep-18 12:47pm    
Just debug your code. Simple.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900