Skip to main content
Roopavathy
Known Participant
March 30, 2017
Answered

Datatable

  • March 30, 2017
  • 2 replies
  • 546 views

Hi,

I am new to Datatable Plugin..Recently I used them in my project..It works well...But after adding links for button to export the data,it doesn't work ....

Here is my code..

https://pastebin.com/14PRqueZ

Please check and help me...

Thanks in advance.

    This topic has been closed for replies.
    Correct answer BenPleysier

    1. Make sure that you have got the following links to the CSS

    <link  rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">

    <link  rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">

    2. Make sure that you have got the following links to the JS

    <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>

    <script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>

    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>

    <script type="text/javascript" language="javascript" src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>

    <script type="text/javascript" language="javascript" src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/pdfmake.min.js"></script>

    <script type="text/javascript" language="javascript" src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/vfs_fonts.js"></script>a

    <script type="text/javascript" language="javascript" src="//cdn.datatables.net/buttons/1.2.4/js/buttons.html5.min.js"></script>

    3. Make sure that the constructor looks like

    <script type="text/javascript">

    $(document).ready(function() {

        $('#example').DataTable( {

            dom: 'Bfrtip',

            buttons: [

                {

                    extend: 'copyHtml5',

                    exportOptions: {

                     columns: ':contains("Office")'

                    }

                },

                'excelHtml5',

                'csvHtml5',

                'pdfHtml5'

            ]

        } );

    } );

    </script>

    From there it should work as expected.

    2 replies

    Roopavathy
    Known Participant
    March 30, 2017

    thanks  a lot...Its working.......... :-)

    BenPleysier
    Community Expert
    BenPleysierCommunity ExpertCorrect answer
    Community Expert
    March 30, 2017

    1. Make sure that you have got the following links to the CSS

    <link  rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">

    <link  rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">

    2. Make sure that you have got the following links to the JS

    <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>

    <script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>

    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>

    <script type="text/javascript" language="javascript" src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>

    <script type="text/javascript" language="javascript" src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/pdfmake.min.js"></script>

    <script type="text/javascript" language="javascript" src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/vfs_fonts.js"></script>a

    <script type="text/javascript" language="javascript" src="//cdn.datatables.net/buttons/1.2.4/js/buttons.html5.min.js"></script>

    3. Make sure that the constructor looks like

    <script type="text/javascript">

    $(document).ready(function() {

        $('#example').DataTable( {

            dom: 'Bfrtip',

            buttons: [

                {

                    extend: 'copyHtml5',

                    exportOptions: {

                     columns: ':contains("Office")'

                    }

                },

                'excelHtml5',

                'csvHtml5',

                'pdfHtml5'

            ]

        } );

    } );

    </script>

    From there it should work as expected.

    Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!