How to amend code to % rather than addition

How to amend code to % rather than addition

atatayloratataylor Posts: 34Questions: 6Answers: 0

I am looking for a solution to calculate a percentage between two columns in a table. I found this section of code on this site, and wondered if it could be amended:

"createdRow": function( row, data, dataIndex ) {
      $('td:eq(4)', row).addClass("sumMe");
      $('td:eq(5)', row).addClass("sumMe");
          var mySum = 0;
          $('td.sumMe', row).each(function() {
            mySum += parseInt( $(this).html(), 10);    
          });
         $('td:eq(7)', row).text(mySum);    
    },

This code adds the values of two columns, 4 and 5 and puts the result in column 7. I was looking to change formula to create a percentage calculation rather than an addition. I also wanted to do the same calculation on columns 4 and 6 and place the second result in column 8. Any help would be appreciated.

This question has accepted answers - jump to:

Answers

  • kthorngrenkthorngren Posts: 14,084Questions: 25Answers: 3,322

    My suggestion is to use -potion columns.render instead of columns.createdRow to calculate two columns. This example shows how to access th data for the full row to perform the calculation.

    Kevin

  • atatayloratataylor Posts: 34Questions: 6Answers: 0

    Thanks Kevin, but I am unsure how to use the information, I do struggle with datatables

  • kthorngrenkthorngren Posts: 14,084Questions: 25Answers: 3,322
    Answer ✓

    Here is a simple example:
    http://live.datatables.net/dehuveca/1/edit

    Kevin

  • AlexHales2345AlexHales2345 Posts: 1Questions: 0Answers: 0

    Another sample site is Modapk

  • atatayloratataylor Posts: 34Questions: 6Answers: 0

    Thanks for that Kevin I now understand it a bit better and have it working in my table, thanks to your help. I am trying to run two similar versions which I can run ok separately but when I try to combine them only the last block of code produces a result. Below is the code I tried, am I on the right track?

    $(document).ready( function () {
      var table = $('table').DataTable({
        columnDefs: [
          {
            targets: 7,
            render: function (data, type, row) {
              return (row[5] / row[4] * 100).toFixed(2) + '%';
            }
          }
        ],
            
          
          columnDefs: [
          {
            targets: 8,
            render: function (data, type, row) {
              return (row[6] / row[4] * 100).toFixed(2) + '%';
            }
          }
        ]
      });
    } );    
    
    

    Thanks again for your help I really appreciate it.

  • kthorngrenkthorngren Posts: 14,084Questions: 25Answers: 3,322
    Answer ✓

    The second option is overwriting the first. Think of columnDefs as a keyword, only one can exist. You need to combine them into one option, like this:

        columnDefs: [
          {
            targets: 7,
            render: function (data, type, row) {
              return (row[5] / row[4] * 100).toFixed(2) + '%';
            }
          },
          {
            targets: 8,
            render: function (data, type, row) {
              return (row[6] / row[4] * 100).toFixed(2) + '%';
            }
          }
        ]
    

    Kevin

  • atatayloratataylor Posts: 34Questions: 6Answers: 0

    Thank you Kevin, I need to spend more time with JavaScript, not just datatables. Thanks again for all your help.

    Regards Alan

Sign In or Register to comment.