Create a new regular table from visible and filtered rows of DataTable

chimos

I have a DataTable with paging, filtering and ColVis plugin (column visibility). By pressing a button, I need to get the visible and filtered data of all pages, and generate a new regular table below with this data (this one without datatables, pager, ...).

I tried with oTable.rows({search:'applied'}).data() to get the rows, but instead of getting only the data of the visible columns, it gets the hidden ones as well. And anyway I don't know how to generate the new table.

Here's a demo

How could I do this?

Thanks in advance

Gyrocode.com

My answer is based on @davidkonrad's answer with some modifications:

$('button.print-bt').on('click', function() {               
    var fvData = oTable.rows({ search:'applied', page: 'all' }).data(); 

    $('#main_wrapper').append(
       '<table id="newTable">' +
       '<thead>'+
       '<tr>'+
          $.map(oTable.columns().visible(),
              function(colvisible, colindex){
                 return (colvisible) ? "<th>" + $(oTable.column(colindex).header()).html() + "</th>" : null;
           }).join("") +
       '</tr>'+
       '</thead>'+
       '<tbody>' +
          $.map(fvData, function(rowdata, rowindex){
             return "<tr>" + $.map(oTable.columns().visible(),
                function(colvisible, colindex){
                   return (colvisible) ? "<td>" + $('<div/>').text(rowdata[colindex]).html() + "</td>" : null;
                }).join("") + "</tr>";
          }).join("") +
       '</tbody></table>'
    );
});

My answer may not work with a table having objects as data source and may need to be modified where data is retrieved with rowdata[colindex].

I'm using $('<div/>').text(data).html() trick to encode HTML entities that could be present in the data.

See this JSFiddle for demonstration.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Create a new regular table from visible and filtered rows of DataTable

From Dev

spotfire new table from file filtered

From Dev

Get all rows from DataTable including those filtered out

From Dev

Apply formula in visible rows that is filtered

From Dev

rowEdit filtered rows on dataTable Primefaces

From Dev

Filter CSV file and create a new file with filtered rows

From Dev

Creating 5 reports from top 5 rows of filtered table

From Dev

Excel VBA loop through visible filtered rows

From Dev

Copying visible/filtered rows efficiently in excel

From Dev

Excel VBA loop through visible filtered rows

From Dev

Chart macro displaying incorrect labels from non-sequential visible rows on filtered worksheet

From Dev

How to create new DataTable with column structure from other DataTable?

From Dev

How to create new DataTable with column structure from other DataTable?

From Dev

How do I get the data from the selected rows of a filtered datatable (DT)?

From Dev

Create a new table from two existing table

From Dev

Need to create a new table from existing table

From Dev

Create a new table from two existing table

From Dev

build new table from rows in astropy

From Dev

Create multiple rows in table from array?

From Dev

Create a function for counting rows from any table

From Dev

Create table from two rows, one column

From Dev

SQL Create table from surrounding rows

From Java

Pandas to create new rows from each exisitng rows

From Dev

Create New Object From DataTable using field Mapping

From Dev

Remove rows from a DataTable

From Dev

Create new table from old table and add 2 new columns

From Dev

How to serialize on all rows not on the filtered ones in Webix datatable

From Dev

Insert (multiple) new rows into a table from another table using a subquery?

From Dev

Insert new rows into table but copy data from another row in the table

Related Related

  1. 1

    Create a new regular table from visible and filtered rows of DataTable

  2. 2

    spotfire new table from file filtered

  3. 3

    Get all rows from DataTable including those filtered out

  4. 4

    Apply formula in visible rows that is filtered

  5. 5

    rowEdit filtered rows on dataTable Primefaces

  6. 6

    Filter CSV file and create a new file with filtered rows

  7. 7

    Creating 5 reports from top 5 rows of filtered table

  8. 8

    Excel VBA loop through visible filtered rows

  9. 9

    Copying visible/filtered rows efficiently in excel

  10. 10

    Excel VBA loop through visible filtered rows

  11. 11

    Chart macro displaying incorrect labels from non-sequential visible rows on filtered worksheet

  12. 12

    How to create new DataTable with column structure from other DataTable?

  13. 13

    How to create new DataTable with column structure from other DataTable?

  14. 14

    How do I get the data from the selected rows of a filtered datatable (DT)?

  15. 15

    Create a new table from two existing table

  16. 16

    Need to create a new table from existing table

  17. 17

    Create a new table from two existing table

  18. 18

    build new table from rows in astropy

  19. 19

    Create multiple rows in table from array?

  20. 20

    Create a function for counting rows from any table

  21. 21

    Create table from two rows, one column

  22. 22

    SQL Create table from surrounding rows

  23. 23

    Pandas to create new rows from each exisitng rows

  24. 24

    Create New Object From DataTable using field Mapping

  25. 25

    Remove rows from a DataTable

  26. 26

    Create new table from old table and add 2 new columns

  27. 27

    How to serialize on all rows not on the filtered ones in Webix datatable

  28. 28

    Insert (multiple) new rows into a table from another table using a subquery?

  29. 29

    Insert new rows into table but copy data from another row in the table

HotTag

Archive