<!DOCTYPE html>
<html>
  <head>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<meta name="description" content="Export with customisable file name" />
    
    <link href="https://cdn.datatables.net/v/bs4/jszip-3.10.1/dt-2.1.3/b-3.1.1/b-colvis-3.1.1/b-html5-3.1.1/r-3.0.2/rg-1.5.0/sl-2.0.4/datatables.min.css" rel="stylesheet">
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/v/bs4/jszip-3.10.1/dt-2.1.3/b-3.1.1/b-colvis-3.1.1/b-html5-3.1.1/r-3.0.2/rg-1.5.0/sl-2.0.4/datatables.min.js"></script>
  
  </head>
  <body>
    <div class="container">
      <table id="example" class="display nowrap" width="100%">
        <thead>
          <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Score</th>
          </tr>
        </thead>
        
        <tbody>
            <tr>
              <td>Pippo</td>
              <td>pos1</td>
              <td>NY</td>
              <td>100</td>
          </tr>
          <tr>
              <td>Pluto</td>
              <td>pos1</td>
              <td>NY</td>
              <td>150</td>
          </tr>
          <tr>
              <td>Paperino</td>
              <td>pos2</td>
              <td>CH</td>
              <td>90</td>
          </tr>
          
        </tbody>
 
      </table>
    </div>
  </body>
</html>
 
body {
  font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  color: #333;
  background-color: #fff;
}
 
$(document).ready(function() {
  
  
 
  function buildRow(data, rowNum, styleNum) {
    // Builds row XML.
    //Params:
    //  data: Row data.
    //  rowNum: Excel row number.
    //  styleNum: style number or empty string for no style.
    //Returns:
    //  String of XML formatted row.
    
    var style = styleNum ? ' s="' + styleNum + '"' : '';
    
    var row = '<row r="' + rowNum + '">';
    for (i=0; i<data.length; i++) {
    
    colNum = (i + 10).toString(36).toUpperCase();  // Convert to alpha
      
        var cr = colNum + rowNum;
      
        row += '<c t="inlineStr" r="' + cr + '"' + style + '>' +
              '<is>' +
                '<t>' + $('<p>' + data[i] + '</p>').text() + '</t>' + //fix to remove eventualli bad closed tags (for example input type=checkbox added to Select plugin)
              '</is>' +
            '</c>';
      
    }
      
    row += '</row>';
        
    return row;
  }
  
  
  
  function getTableData() {
    
    var ws = '';
    var rowNum = 1;
    
    ws += '<sheetData>';
    
    $("#example tbody tr").each(function(val, index){
        
          var arrData = [];
        
           if ( $(this).find("td").length ) {
             arrData = $(this).find("td").map(function (){
               return $(this).text().trim();
             }).get();
           }
        
          if ( $(this).find("th").length ) {
             arrData = $(this).find("th").map(function (){
               return $(this).text().trim();
             }).get();
           }
        
          ws += buildRow(arrData, rowNum, '');
          rowNum++;
        
        });
    
    ws += '</sheetData>';
    return ws;
  }
  
  
  function updateSheet1(xlsx) {
    var newSheet = '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>'+
      '<worksheet xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main" xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:x14ac="http://schemas.microsoft.com/office/spreadsheetml/2009/9/ac" mc:Ignorable="x14ac">'+
      getTableData() + '</worksheet>';
    // Get sheet.
    var sheet = xlsx.xl.worksheets['sheet1.xml'] = $.parseXML(newSheet);
    
  }
  function getDataSrc(dt) {
    // Return the RowGroup dataSrc
    var dataSrc = dt.rowGroup().dataSrc();
    // If multi level use only the first level
    if ( Array .isArray( dataSrc ) ) {
      dataSrc = dataSrc[0];
    }
    return dataSrc;
  }
  var table = $('#example').DataTable({
    rowGroup: {
                startRender: null,
                endRender: function (rows, group) {
                    
                    var sum =
                    rows
                    .data()
                    .pluck(3)
                    .reduce((a, b) => { 
                        var x = parseFloat(a) || 0;
                        var y = parseFloat(b.replace(/[^\d.-]/g, '')) || 0;
                        return x + y;
                    }, 0);
                    
                    return $('<tr/>')
                    .append(
                        '<th>' + 'Totale di ' + group + '</th>' +
                        '<th>' + '' + '</th>' +
                      '<th>' + '' + '</th>' +
                        '<th class="text-right">' + sum + '</th>');
                    
                    
                },
                dataSrc: 2
            },
    order: [[2, 'asc']],
    // dom: 'Bfrtip',
        layout: {
            top2Start: 'pageLength',
            top2End: null,
            topStart: 'buttons',
            topEnd: 'search',
            bottomStart: 'info',
            bottomEnd: 'paging'
        },  
    
    buttons: [
 
      {
        extend: 'excelHtml5',
        text: 'RowGroup Excel',
        // Options supported by RowGroup customize function
        title: '',
        header: true,
        messageTop: 'This is the top',
        messageBottom: 'This is the bottom',
        sheetName: 'Single Sheet',
        footer: true,
        exportOptions: {
          modifier: {
            search: 'applied',
          }
        },
        customize: function( xlsx, button, dt ) {
          updateSheet1(xlsx);
        },
      }]
  });
});
Output

This bin was created anonymously and its free preview time has expired. Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers