title: Datatables - Calculate Column Total when using Row Groups
body: <p>I am using datatables. In addition to the regular table set up I am using datatables to add</p>
  
  <p><strong>Row Groups</strong>
  - Outlined <a href="http://datatables.net/release-datatables/examples/advanced_init/row_grouping.html" rel="nofollow">here</a> </p>
  
  <p><strong>Column Totals</strong>
  - Using Footer Callbacled Outlined <a href="http://datatables.net/release-datatables/examples/advanced_init/footer_callback.html" rel="nofollow">here</a></p>
  
  <p>I have a working Demo here <strong><a href="http://jsfiddle.net/c5UXe/" rel="nofollow">http://jsfiddle.net/c5UXe/</a></strong></p>
  
  <p>Everything is working fine except my totals are being calculated 1 column off to the right (as you can easily see from demo) I am pretty sure the reason is because of the way groups works and is displayed.</p>
  
  <p>I would like to display the totals under the correct column. i.e. shift all totals 1 column left to line up correctly.</p>
  
  <p>The code used uses the first <code>&lt;td&gt;</code> in the row to use as the group name so for example</p>
  
  <p><code>&lt;td&gt;Joe Hammer&lt;/td&gt;</code> is used as a group name. </p>
  
  <p>This is the code I am using to calculate the totals</p>
  
  <pre><code>"fnFooterCallback": function (nRow, aasData, iStart, iEnd, aiDisplay) {
  
          var columnas = [1, 2, 3, 4, 5, 6, 7]; //the columns you wish to add            
          for (var j in columnas) {
              var columnaActual = columnas[j];
              var total = 0;
              for (var i = iStart; i &lt; iEnd; i++) {
                  total = total + parseFloat(aasData[aiDisplay[i]][columnaActual]);
              }
              $($(nRow).children().get(columnaActual)).html(total);
  
          } // end 
  </code></pre>