Calculating data in tables with Javascript/Jquery

Question

So I'm trying to do some calculations inside a HTML table with Javascript/Jquery. There are 7 columns in 1 table and each column should do their calculations based on the values that are in the cells in those columns.

I did manage to make this work for one, but once I try coding it so it works for every column I get stuck and I don't know where to start. Right now it just keeps up adding all the values from every cell with that classname and puts it in all the corresponding cells.

Any help/suggestions are highly appreciated.

Created a fiddle with it if I left out any information please tell me

https://fiddle.jshell.net/gu8feydq/

var aankoopprijs = $(".calc-aankoop").text();
var ob = $(".calc-ob").text();
var add = parseFloat(aankoopprijs) - parseFloat(ob);
$(".calc-marktprijs").html(add);

//Calculate the Groothandelprijs
var marktprijs = $(".calc-marktprijs").text();
var kruissubsidie = $(".calc-kruissubsidie").text();
var add2 = parseFloat(marktprijs) - parseFloat(kruissubsidie);
$(".calc-groothandelsprijs").html(add2);

//Calculate the Eindgebruikerstarief
var groothandelsprijs = $(".calc-groothandelsprijs").text();
var ob2 = $(".calc-ob2").text();
var add3 = parseFloat(groothandelsprijs) - parseFloat(ob2);
$(".calc-eindgebruik").html(add3);



  
    
      Producten
      Mogas
      Gasolie
      LPG 100
      LPG 20
      Gasolie
      Diesel
      Marine fuel oil
    
    
      1 Aankoopprijs
      800
       
      500
       
       
       
       
    
    
      5 O.B. 6%
      50
       
      25
       
       
       
       
    
    
      6 Marktprijs = som 1-5
       
       
       
       
       
       
       
    
    
      8 Kruissubsidie
      4
       
       
       
       
       
       
    
    
      9 Groothandelsprijs = som 6-8
       
       
       
       
       
       
       
    
    
      11 O.B. 6%
      50
       
       
       
       
       
       
    
    
      12 Eindgebruikerstarief = som 9-11

Barmar · Accepted Answer

You need to loop over the elements with .each(), and then perform the calculations using the corresponding elements to process each column.

$(".calc-aankoop").each(function(i) {
  var aankoopprijs = $(this).text();
  var ob = $(".calc-ob").eq(i).text();
  var add = parseFloat(aankoopprijs) - parseFloat(ob);
  $(".calc-marktprijs").eq(i).html(add);

  //Calculate the Groothandelprijs
  var marktprijs = $(".calc-marktprijs").eq(i).text();
  var kruissubsidie = $(".calc-kruissubsidie").eq(i).text();
  var add2 = parseFloat(marktprijs) - parseFloat(kruissubsidie);
  $(".calc-groothandelsprijs").eq(i).html(add2);

  //Calculate the Eindgebruikerstarief
  var groothandelsprijs = $(".calc-groothandelsprijs").eq(i).text();
  var ob2 = $(".calc-ob2").eq(i).text();
  var add3 = parseFloat(groothandelsprijs) - parseFloat(ob2);
  $(".calc-eindgebruik").eq(i).html(add3);
});



  
    
      Producten
      Mogas
      Gasolie
      LPG 100
      LPG 20
      Gasolie
      Diesel
      Marine fuel oil
    
    
      1 Aankoopprijs
      800
       
      500
       
       
       
       
    
    
      5 O.B. 6%
      50
       
      25
       
       
       
       
    
    
      6 Marktprijs = som 1-5
       
       
       
       
       
       
       
    
    
      8 Kruissubsidie
      4
       
       
       
       
       
       
    
    
      9 Groothandelsprijs = som 6-8
       
       
       
       
       
       
       
    
    
      11 O.B. 6%
      50
       
       
       
       
       
       
    
    
      12 Eindgebruikerstarief = som 9-11

Calculating data in tables with Javascript/Jquery

Answers (2)

Related Questions