CSV Export button not working

mdobrian

I'm hopeful someone can help me determine the issue here. I believe the version of jquery I'm using is dated about a year later than the version of Buttons I'm using. Should I be using a newer version of Buttons?

I'm using jquery 3.3.1 & buttons 1.5.1. Excel & PDF appear to work in Chrome while CSV just saves a blank file without a filename or csv extension. No options (Excel, PDF, CSV) appear to work in Firefox or IE.

function setupSearchResults() {

var searchResultsTableSelector = $("#search-results-table");
var theme = $.cookie("jquery-ui-theme-haystack");

if (searchResultsTableSelector.length === 1) {
    var searchResultsTable = $("#search-results-table").dataTable( {
        "jQueryUI": true,
        "pageLength": 50,
        "pagingType": "full_numbers",
        "paging": true,
        "lengthChange": true,
        "lengthMenu":  [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
        "ordering": true,
        "info": true,
        "order": [],
        "columns": [
            null,
            { "searchable": false, "orderable": false },
            null,
            null
        ],
        "autoWidth": true,
        "search": { "search":"", "regex": true, "smart": false, "caseInsensitive": true },
        "language": {
            "search": "<span style='font-size:12px;'>Filter results:</span>"
        },
        "dom": 'B<"toolbar"><"top fg-toolbar ui-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"flip>t<"bottom fg-toolbar ui-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip><"clear">', //'<"H" Tr i<"toolbar">f<"clear_row"><lp>>t<"F"ip>', 'B<"toolbar"><"top"flip>tr<"bottom"ip><"clear">
        "buttons": [
            'csv'
        ],
        "drawCallback": function (settings) {

....

kthorngren

There have been some Excels fixes when using IE that are in the latest version (1.5.4). I've not heard of the problem descriptions you stated. While upgrading to 1.5.4 is recommended it may not fix your issues. Can you post a link to your page for troubleshooting?

Kevin

mdobrian

It is internal to my company so I can't post a link. I did upgrade to 1.5.4 and got CSV, Excel & PDF working for Chrome & IE, but still not working in Firefox.

kthorngren

but still not working in Firefox.

What exactly happens?

What version of Firefox are you using?

Does this example work for you in Firefox?
https://datatables.net/extensions/buttons/examples/html5/simple.html

It is internal to my company so I can't post a link

If the examples work for you but your page doesn't then we would need to see a test case to help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

mdobrian

The example works fine in my version of Firefox (65.0.1). The CSV Export button which seems to require Flash, does not appear to execute in my problem code for firefox, but works fine in Chrome and IE. Is Flash still required for these buttons? I'm unable to pinpoint where flash is being called for this button.

colin

Hi @mdobrian ,

It would be worth trying the example page here and seeing if that works for you. That could determine if the issue is the browser or the configuration.

You shouldn't need Flash, as you're not using the csvFlash button. It would be worth trying the csvHtml5 button (example here) to see if that works.

Hope that helps,

Colin

mdobrian

Well, I switched it to use csvFlash and it appears to work in Firefox, IE and Chrome, so I think that will get me by for now. Thanks for your help!

mdobrian

I stand corrected. csvFlash is NOT working for me. I thought it was but now am questioning my sanity. Firefox was extremely slow with Flash enabled, so I tried re-installing the plugin/browser and csvFlash (if it was ever working) stopped working.

I've proceeded to try to remove Flash from my project and am finding something strange.

The buttons in this dataTable only show up when Flash is enabled in Firefox. I'm
The buttons disappear when I comment out the loading of js/jquery/buttons.flash.js
The CSV button disappears if I change buttons.flash.js from ...
DataTable.ext.buttons.csvFlash = $.extend( {}, flashButton, {
to...
DataTable.ext.buttons.csvFlash2 = $.extend( {}, flashButton, {

It seems to me that somehow csv is being redirected to csvFlash?

function setupSearchResults() {

var searchResultsTableSelector = $("#search-results-table");
var theme = $.cookie("jquery-ui-theme-haystack");

if (searchResultsTableSelector.length === 1) {
    var searchResultsTable = $("#search-results-table").dataTable( {
        "jQueryUI": true,
        "pageLength": 50,
        "pagingType": "full_numbers",
        "paging": true,
        "lengthChange": true,
        "lengthMenu":  [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
        "ordering": true,
        "info": true,
        "order": [],
        "columns": [
            null,
            { "searchable": false, "orderable": false },
            null,
            null
        ],
        "autoWidth": true,
        "search": { "search":"", "regex": true, "smart": false, "caseInsensitive": true },
        "language": {
            "search": "<span style='font-size:12px;'>Filter results:</span>"
        },
        "dom": 'B<"toolbar">' + 
               '<"top fg-toolbar ui-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"flip>' +
               't' +
               '<"bottom fg-toolbar ui-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>' +
               '<"clear">', //'<"H" Tr i<"toolbar">f<"clear_row"><lp>>t<"F"ip>', 'B<"toolbar"><"top"flip>tr<"bottom"ip><"clear">
        "buttons": [
            'excel','csv',{
                extend: 'csv',
                text: 'Blah csv'
            }

mdobrian

If I add the following it seems to override the flash button, but the click function doesn't work. Am I doing something wrong?

$("div.dt-buttons").html('<button id="saveToCsv" style="margin-top:0px;">test</button>')
function setupSaveToCsv() {

$("#saveToCsv").click(function() {
      $("#search-results-table").fn.dataTable.ext.buttons.csvHtml5.action.call(this, e, dt, node, config);
});

}

tangerine

Your Buttons configuration syntax is wrong.
Check the docs:
https://datatables.net/extensions/buttons/config

colin

Hi @mdobrian ,

It would be worth using the HTML5 buttons as I mentioned before - flash is vanishing, and isn't supported on most mobile devices.

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin