From 0da52de497f37f094cb5065842f54f32c1eb34f5 Mon Sep 17 00:00:00 2001 From: Rob Garrison Date: Mon, 2 Jan 2017 07:26:33 -0600 Subject: [PATCH] Output: Add `output_includeHeader` option & docs. Fixes #1349 --- docs/example-widget-output.html | 223 ++++++++++++++++++++++---------- js/widgets/widget-output.js | 29 +++-- 2 files changed, 168 insertions(+), 84 deletions(-) diff --git a/docs/example-widget-output.html b/docs/example-widget-output.html index 10dc8ffe..dfb58286 100644 --- a/docs/example-widget-output.html +++ b/docs/example-widget-output.html @@ -42,7 +42,7 @@ text-align: right; margin-right: 4px; } - div.output-download-popup { + .dropdown-menu li div { margin-bottom: 5px; } .output-separator, .output-replacequotes, .output-quotes { @@ -91,7 +91,7 @@ table.tablesorter tbody tr.even.checked td { // buttons set up like this: // $('button[data-filter-column]').click(function(){ - /*** first method *** data-filter-column="1" data-filter-text="!son" + /*** first method *** data-filter-column="2" data-filter-text="!son" add search value to Discount column (zero based index) input */ var filters = [], $t = $(this), @@ -115,14 +115,16 @@ table.tablesorter tbody tr.even.checked td { headerTemplate : '{content} {icon}', widgets: ["zebra", "filter", "uitheme", "output"], widgetOptions : { - filter_filteredRow : 'filtered', - filter_reset : '.group1 .reset', + filter_filteredRow : 'filtered', + filter_reset : '.group1 .reset', + output_separator : ',', // ',' 'json', 'array' or separator (e.g. ';') - output_ignoreColumns : [0], // columns to ignore [0, 1,... ] (zero-based index) + output_ignoreColumns : [0], // columns to ignore [0, 1,... ] (zero-based index) output_hiddenColumns : false, // include hidden columns in the output output_includeFooter : true, // include footer rows in the output + output_includeHeader : true, // include header rows in the output + output_headerRows : false // output all header rows (if multiple rows) output_dataAttrib : 'data-name', // data-attribute containing alternate cell text - output_headerRows : true, // output all header rows (multiple rows) output_delivery : 'p', // (p)opup, (d)ownload output_saveRows : 'f', // (a)ll, (v)isible, (f)iltered, jQuery filter selector (string only) or filter function output_duplicateSpans: true, // duplicate output data in tbody colspan/rowspan @@ -133,7 +135,9 @@ table.tablesorter tbody tr.even.checked td { output_popupStyle : 'width=580,height=310', output_saveFileName : 'mytable.csv', // callbackJSON used when outputting JSON & any header cells has a colspan - unique names required - output_callbackJSON : function($cell, txt, cellIndex) { return txt + '(' + cellIndex + ')'; }, + output_callbackJSON : function($cell, txt, cellIndex) { + return txt + '(' + cellIndex + ')'; + }, // callback executed when processing completes output_callback : function(config, data, url) { // return false to stop delivery & do something else with the data @@ -142,8 +146,13 @@ table.tablesorter tbody tr.even.checked td { }, // the need to modify this for Excel no longer exists - output_encoding : 'data:application/octet-stream;charset=utf8,' - + output_encoding : 'data:application/octet-stream;charset=utf8,', + // override internal save file code and use an external plugin such as + // https://github.com/eligrey/FileSaver.js + output_savePlugin : null /* function(config, widgetOptions, data) { + var blob = new Blob([data], {type: widgetOptions.output_encoding}); + saveAs(blob, widgetOptions.output_saveFileName); + } */ } }).tablesorterPager({ container: $('.ts-pager'), @@ -180,7 +189,7 @@ table.tablesorter tbody tr.even.checked td { // make separator & replace quotes buttons update the value $this.find('.output-separator').click(function(){ $this.find('.output-separator').removeClass('active'); - var txt = $(this).addClass('active').html() + var txt = $(this).addClass('active').html(); $this.find('.output-separator-input').val( txt ); $this.find('.output-filename').val(function(i, v){ // change filename extension based on separator @@ -195,27 +204,42 @@ table.tablesorter tbody tr.even.checked td { $this.find('.output-replacequotes').val( $(this).addClass('active').text() ); return false; }); - + // header/footer toggle buttons + $this.find('.output-header, .output-footer').click(function(){ + $(this).toggleClass('active'); + }); // clicking the download button; all you really need is to // trigger an "output" event on the table $this.find('.download').click(function(){ var typ, $table = $this.find('table'), wo = $table[0].config.widgetOptions, - saved = $this.find('.output-filter-all :checked').attr('class'); - wo.output_separator = $this.find('.output-separator-input').val(); - wo.output_delivery = $this.find('.output-download-popup :checked').attr('class') === 'output-download' ? 'd' : 'p'; - wo.output_saveRows = saved === 'output-filter' ? 'f' : - saved === 'output-visible' ? 'v' : - saved === 'output-selected' ? '.checked' : // checked class name, see table.config.checkboxClass - saved === 'output-sel-vis' ? '.checked:visible' : + val = $this.find('.output-filter-all :checked').attr('class'); + wo.output_saveRows = val === 'output-filter' ? 'f' : + val === 'output-visible' ? 'v' : + // checked class name, see table.config.checkboxClass + val === 'output-selected' ? '.checked' : + val === 'output-sel-vis' ? '.checked:visible' : 'a'; + val = $this.find('.output-download-popup :checked').attr('class'); + wo.output_delivery = val === 'output-download' ? 'd' : 'p'; + wo.output_separator = $this.find('.output-separator-input').val(); wo.output_replaceQuote = $this.find('.output-replacequotes').val(); wo.output_trimSpaces = $this.find('.output-trim').is(':checked'); wo.output_includeHTML = $this.find('.output-html').is(':checked'); wo.output_wrapQuotes = $this.find('.output-wrap').is(':checked'); - wo.output_headerRows = $this.find('.output-headers').is(':checked'); wo.output_saveFileName = $this.find('.output-filename').val(); + + // first example buttons, second has radio buttons + if (groupIndex === 0) { + wo.output_includeHeader = $this.find('button.output-header').is(".active"); + } else { + wo.output_includeHeader = !$this.find('.output-no-header').is(':checked'); + wo.output_headerRows = $this.find('.output-headers').is(':checked'); + } + // footer not included in second example + wo.output_includeFooter = $this.find('.output-footer').is(".active"); + $table.trigger('outputTable'); return false; }); @@ -247,40 +271,55 @@ table.tablesorter tbody tr.even.checked td {

Changes

+ +
+

Older Notes

+
+
    +
  • In v2.22.2,
      -
    • For example, if you want to only output rows with an active checkbox, set this option to '.checked' (default class added by the checkbox parser contained in the "parser-input-select.js" file).
      • -
    • To output only visible active checkboxes, set this option to '.checked:visible'.
      • -
    • To output rows without an active checkbox, set this option to ':not(.checked)', etc.
      • -
    • More details can be found in the options section.
      • +
    • The data-attribute used by the output_dataAttrib can now be an empty string.
      • +
    • Update output_saveRows option, it now includes the ability to set a jQuery filter selector. +
        +
      • For example, if you want to only output rows with an active checkbox, set this option to '.checked' (default class added by the checkbox parser contained in the "parser-input-select.js" file).
        • +
      • To output only visible active checkboxes, set this option to '.checked:visible'.
        • +
      • To output rows without an active checkbox, set this option to ':not(.checked)', etc.
        • +
      • More details can be found in the options section.
        • +
      +
      • +
    • Fix issue with output_hiddenColumns causing an empty output.
    • -
  • Fix issue with output_hiddenColumns causing an empty output.
    • +
  • In v2.22.0, +
      +
    • Added the BOM back to the UTF-8 csv downloadable file to support unicode characters in Excel.
      • +
    • Add output_hiddenColumns which includes hidden columns in the output when true.
      • +
    +
    • +
  • In v2.21.0, added the output_includeFooter option.
    • +
  • In v2.17.5, the need to modify the server's content disposition no longer exists.
    • +
  • In v2.17.0, +
      +
    • Added the output_ignoreColumns option & modified the output_callback parameters.
      • +
    • Added output_duplicateSpans option to duplicate (when true) colspan & rowspan content across cells.
      • +
    +
    • +
  • In v2.16.4, added the output_encoding option.
- -
  • In v2.22.0, -
      -
    • Added the BOM back to the UTF-8 csv downloadable file to support unicode characters in Excel.
      • -
    • Add output_hiddenColumns which includes hidden columns in the output when true.
      • -
    -
    • -
  • In v2.21.0, added the output_includeFooter option.
    • -
  • In v2.17.5, the need to modify the server's content disposition no longer exists.
    • -
  • In v2.17.0, -
      -
    • Added the output_ignoreColumns option & modified the output_callback parameters.
      • -
    • Added output_duplicateSpans option to duplicate (when true) colspan & rowspan content across cells.
      • -
    -
    • -
  • In v2.16.4, added the output_encoding option.
    • - +
    +

    Requirements

    diff --git a/js/widgets/widget-output.js b/js/widgets/widget-output.js index 9eb2c9cc..0aef0e1e 100644 --- a/js/widgets/widget-output.js +++ b/js/widgets/widget-output.js @@ -26,7 +26,7 @@ replaceTab : '\x09', popupTitle : 'Output', - popupStyle : 'width:100%;height:100%;', // for textarea + popupStyle : 'width:100%;height:100%;margin:0;resize:none;', // for textarea message : 'Your device does not support downloading. Please try again in desktop browser.', init : function(c) { @@ -183,9 +183,13 @@ // requires JSON stringify; if it doesn't exist, the output will show [object Object],... in the output window mydata = hasStringify ? JSON.stringify(tmpData) : tmpData; } else { - tmp = [ headers[ ( len > 1 && wo.output_headerRows ) ? indx % len : len - 1 ] ]; - tmpData = output.row2CSV(wo, wo.output_headerRows ? headers : tmp, outputArray) - .concat( output.row2CSV(wo, csvData, outputArray) ); + if (wo.output_includeHeader) { + tmp = [ headers[ ( len > 1 && wo.output_headerRows ) ? indx % len : len - 1 ] ]; + tmpData = output.row2CSV(wo, wo.output_headerRows ? headers : tmp, outputArray) + .concat( output.row2CSV(wo, csvData, outputArray) ); + } else { + tmpData = output.row2CSV(wo, csvData, outputArray); + } // stringify the array; if stringify doesn't exist the array will be flattened mydata = outputArray && hasStringify ? JSON.stringify(tmpData) : tmpData.join('\n'); @@ -369,8 +373,9 @@ output_ignoreColumns : [], // columns to ignore [0, 1,... ] (zero-based index) output_hiddenColumns : false, // include hidden columns in the output output_includeFooter : false, // include footer rows in the output + output_includeHeader : true, // include header rows in the output + output_headerRows : false, // if true, include multiple header rows output_dataAttrib : 'data-name', // header attrib containing modified header name - output_headerRows : false, // if true, include multiple header rows (JSON only) output_delivery : 'popup', // popup, download output_saveRows : 'filtered', // (a)ll, (v)isible, (f)iltered or jQuery filter selector output_duplicateSpans : true, // duplicate output data in tbody colspan/rowspan @@ -390,14 +395,12 @@ output_callbackJSON : function($cell, txt, cellIndex) { return txt + '(' + (cellIndex) + ')'; }, // the need to modify this for Excel no longer exists output_encoding : 'data:application/octet-stream;charset=utf8,', - /* override internal save file code and use an external plugin such as - * https://github.com/eligrey/FileSaver.js (example) - * output_savePlugin: function(config, widgetOptions, data) { - * var blob = new Blob([data], {type: wo.output_encoding}); - * saveAs(blob, wo.output_saveFileName); - * } - */ - output_savePlugin : null + // override internal save file code and use an external plugin such as + // https://github.com/eligrey/FileSaver.js + output_savePlugin : null /* function(c, wo, data) { + var blob = new Blob([data], {type: wo.output_encoding}); + saveAs(blob, wo.output_saveFileName); + } */ }, init: function(table, thisWidget, c) { output.init(c);