Add or substract value of mutiple elements to total value

Question

So I have made a function which changes my values in a "cart". Every input field has their one value and this is added or substracted on it's total on change of the input field. It looks like this:

And my code looks like this (yes I am gonna cleanup the html+css later, this is just for testing :-):

 var extraValues = document.querySelectorAll("input[type=number]");
 var extraTotal = 0;
 
 Array.prototype.forEach.call(extraValues, function (extraValue) {
  extraValue.addEventListener('change', function() {
   var getExtraId = extraValue.id; 
   var extraLength = getExtraId.length;
   var currentExtra = getExtraId.charAt(extraLength - 1);
   var catId = "testKassabon" + currentExtra;
   var extraSort = extraValue.parentElement.querySelector('label');
   var extraPrice = extraValue.parentElement.querySelector('.extraPrice').innerText;
   var totalPrice = extraPrice * this.value;
   var showExtra = document.getElementById(catId);
   showExtra.innerHTML = "" + this.value + "x " + extraSort.innerText + "
€ " + totalPrice + "";
    })
 });

.col-form-label {
 font-weight: 700;
 display: block;
 width: 100%;
 padding-bottom: 5px;
}




             7.50
            3-gangendiner
               



            10
            Fietshuur
               



            2.50
            Uitgebreid ontbijtbuffet
               




 Uw totaalprijs

This works perfectly. But now I need to calculate the total amount of these 3 values each time one of the inputs changes, and show it in id="totalPrice". I have NO idea how to do this, since everytime I try this it just replaced the total pricing instead of adding or substracting it from the total. Does anyone know how to do this?

Waleed Nasir · Accepted Answer

Try this Code man thanks :-)

  
  function countProperties(obj) {
    var count = 0;

    for(var prop in obj) {
    console.log(prop,obj)
        if(obj.hasOwnProperty(prop))
          count = count +obj[prop];
    } 

    return count;
}


var total = {}
                         var extraValues = document.querySelectorAll("input[type=number]");
                         var extraTotal = 0;
                         
                         Array.prototype.forEach.call(extraValues, function (extraValue) {
                          extraValue.addEventListener('change', function() {
                           var getExtraId = extraValue.id; 
                           var extraLength = getExtraId.length;
                           var currentExtra = getExtraId.charAt(extraLength - 1);
                           var catId = "testKassabon" + currentExtra;
                           var extraSort = extraValue.parentElement.querySelector('label');
                           var extraPrice = extraValue.parentElement.querySelector('.extraPrice').innerText;
                           var totalPrice = extraPrice * this.value;
                          total[catId] = totalPrice
                

                 // var TotalCost = Object.values(total).reduce((a, b) //=> a + b, 0)
        

   
        var TotalCost = countProperties(total)
                          console.log(TotalCost)
                         alert(TotalCost)



                           var showExtra = document.getElementById(catId);
                           showExtra.innerHTML = "" + this.value + "x " + extraSort.innerText + "
€ " + totalPrice + "";
                            })
                
                
                
                         });

        .col-form-label {
                         font-weight: 700;
                         display: block;
                         width: 100%;
                         padding-bottom: 5px;
                        }

                
                        
                        
                        
                                     7.50
                                    3-gangendiner
                                       
                        
                
                        
                                    10
                                    Fietshuur
                                       
                        
                
                        
                                    2.50
                                    Uitgebreid ontbijtbuffet
                                       
                        
                        
                
                        
                         Uw totaalprijs

Add or substract value of mutiple elements to total value

Answers (2)

Solution

Related Questions