Problem Datatable buttons

klasss

Hello,

I try use datatable with buttons (Excel, PDF, print...) .
I see this link https://datatables.net/extensions/buttons/examples/initialisation/export.html

I put all the CSS and JS, but dont see buttons

My code:

<link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.2.2/css/buttons.dataTables.min.css">

TABLE

<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.2/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.2/js/buttons.html5.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.2/js/buttons.print.min.js"></script>
  <script src="//cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js" defer></script>

  
<script>
      $(document).ready( function () {
        $('#teste').DataTable({
          dom: 'Bfrtip',
        buttons: [
            'copy', 'csv', 'excel', 'pdf', 'print'
        ]
    } );
      } );

  </script>

where did i go wrong?
In the order I put JS?

Thanks to whoever can help me

Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

colin

That looks like it should be good. 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

klasss

hello colin,

Thanks,
I think my problem is in the order I put things.
I have the following form : CSS .

<

table> , script and then the datatable script

kthorngren

jquery.dataTables.min.js in line 8 needs to load before the dataTables.buttons.min.js in line 2. The js include files sometimes have dependancies. jquery.dataTables.min.js depends on jquery-3.6.0.js so you need to load jquery-3.6.0.js first. Move line 8 between lines 1 and 2 for something like this:

<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="//cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js" defer></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.2/js/dataTables.buttons.min.js"></script>

The best option is to use the Download Builder. This will provide all the files you select and in the proper order.

Kevin