Buttons extension - a few export issues, and collection issues

Buttons extension - a few export issues, and collection issues

normadizenormadize Posts: 31Questions: 6Answers: 1
edited November 2015 in Free community support

This is probably aimed at @jLinux who steered me to try the new Buttons extension and forget about TableTools.

I'm trying it now and hit a few bumps. I'm using the bootstrap theme for DataTables and Buttons and configured buttons as a collection as below. I'm loading the following css and javascript files:

<link rel="stylesheet" type="text/css" href="js/DataTables/DataTables-1.10.10/css/dataTables.bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="js/DataTables/Buttons-1.1.0/css/buttons.bootstrap.min.css"/>

<script type="text/javascript" src="js/DataTables/DataTables-1.10.10/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="js/DataTables/DataTables-1.10.10/js/dataTables.bootstrap.min.js"></script>
<script type="text/javascript" src="js/DataTables/Buttons-1.1.0/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="js/DataTables/Buttons-1.1.0/js/buttons.bootstrap.min.js"></script>
<script type="text/javascript" src="js/DataTables/Buttons-1.1.0/js/buttons.flash.min.js"></script>
<script type="text/javascript" src="js/DataTables/Buttons-1.1.0/js/buttons.html5.min.js"></script>

Config:

....

buttons: [
    {
        extend: 'collection',
        text: 'Export',
        buttons: [
            {
                extend: 'csv',
                text: 'To clipboard'
            },
            {
                extend: 'copy',
                text: 'To CSV'
            },
            {
                extend: 'excel',
                text: 'To Excel'
            },
        ]
    }
],

....

$('#export-table').append(datatable.buttons().container())

Note that:

  • one of my cells has html in it (I have a render call back on that column).
  • the table data is loaded from a JS Array whose rows contain elements of different type. In each row some elements are Array themselves, some are String, some are Number. The type is, however, consistent (index i in each row has the same type for all i)

The following happens:

  • Clicking the CSV button produces an immensely long file name which seems to be made of the text from all cells that are String and Number which are currently displayed, i.e. the current page position in the table, which in my case has 10 rows and about 7 columns whose cells are String and Number (so I get about 70 words in the file name). I tried without collection too and it's the same.
  • Clicking the Excel does nothing. I tried without collection too and it's the same. It pauses for a while after clicking it and then does nothing. Browser console shows no error. It's probably linked to the same file naming issue as for the CSV but in this case it fails completely ...
  • The drop-down menu entries are not styled. They show up as <a>To CSV</a> (note the missing href) and the CSS for links is not applied, making them look like normal text and clicking on them is tricky (hit and miss as it's a text cursor selecting text)

TableTools has been working just fine without any of the above issues. The only reason I'm interested in the Buttons extension is its HTML5 compatibility that should allow me to export in Android and iOS.

The above seem like internal issues. Anything I can do on my end to address them rather than wait for a code update on your end?

Cheers!

Answers

  • jLinuxjLinux Posts: 981Questions: 73Answers: 75

    Clicking the CSV button produces an immensely long file name which seems to be made of the text from all cells that are String and Number which are currently displayed, i.e. the current page position in the table, which in my case has 10 rows and about 7 columns whose cells are String and Number (so I get about 70 words in the file name). I tried without collection too and it's the same.

    I change the name of my file by using the title setting. Its in the csv settings. Heres my button cfg, you can see how I rename it there.

    Clicking the Excel does nothing. I tried without collection too and it's the same. It pauses for a while after clicking it and then does nothing. Browser console shows no error. It's probably linked to the same file naming issue as for the CSV but in this case it fails completely ...

    Hm... Can you upload the excel file somewhere for me to download it? And how many rows is it saving? And try using either csvHtml5 or csvFlash, see if one of those work. It might also be browser related

    The drop-down menu entries are not styled. They show up as <a>To CSV</a> (note the missing href) and the CSS for links is not applied, making them look like normal text and clicking on them is tricky (hit and miss as it's a text cursor selecting text)

    Drop down menu entries?..

    I really need to be able to replicate this, link me to it somewhere if you can. its more than likely just some config issue, because the Buttons extension is very stable

  • normadizenormadize Posts: 31Questions: 6Answers: 1
    edited November 2015

    Excel: as I said, it does nothing ... doesn't save anything. I actually don't need Excel, just reported the problem.

    Dropdown menu: yes, see the code that I included above (note the collection bit which makes a dropdown menu)

    Rows: the table has 710 rows. About 15-18 columns. The old TableTools works fine.

    It felt very unstable to me but I believe you. I don't have time to look further into it now but will get to it (had to rush a project).

  • jLinuxjLinux Posts: 981Questions: 73Answers: 75

    If you can put it somewhere i can replicate it, then ill more than likely be able to see whats wrong

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    In theory Buttons should be a massive improvement over TableTools, but it is still relatively new while TableTools is mature, so there could be teething issues. If you could post a link to a page showing the issue you describe that would be helpful.

    Allan

This discussion has been closed.