How To Export HTML Table To PDF And Excel In jQuery Datatable
Posted By : Rajan Rawat | 14-Mar-2018
Datatables
DataTables is a plug-in for jQuery and it has the option of customizable with the huge range.The below example will show you the basics of the dataTables and also tell you about the how you can customize the table and passing of object that you want to add or delete in the table
whenever exporting the data from the table it can be the important part of an application. extension of buttons for dataTables will provide three types of plug-in that give you overlapping functionality for export of data
lets see how to use it. It is very easy to implement the functionality when it comes to export the jQuery dataTables to pdf or excel file,
In this whole blog, we will walk through some features and implement them in
that are given below
jQuery: it is a small library of JavaScript and a rich features that enable the manipulation of DOM, handling events, animations and the last ajax
DataTables: it is the jQuery plug-in which is the new enhanced version of tables and it comes with so many controls
Bootstrap: it is a framework of frontend and it is basically used for responsiveness and mobile projects on the web
HTML CODE
Name | Position | Office | Age | Start date | Salary |
---|---|---|---|---|---|
Name | Position | Office | Age | Start date | Salary |
Tiger Nixon | System Architect | Edinburgh | 61 | 2011/04/25 | $320,800 |
Garrett Winters | Accountant | Tokyo | 63 | 2011/07/25 | $170,750 |
Ashton Cox | Junior Technical Author | San Francisco | 66 | 2009/01/12 | $86,000 |
Cedric Kelly | Senior Javascript Developer | Edinburgh | 22 | 2012/03/29 | $433,060 |
Airi Satou | Accountant | Tokyo | 33 | 2008/11/28 | $162,700 |
Brielle Williamson | Integration Specialist | New York | 61 | 2012/12/02 | $372,000 |
Herrod Chandler | Sales Assistant | San Francisco | 59 | 2012/08/06 | $137,500 |
Rhona Davidson | Integration Specialist | Tokyo | 55 | 2010/10/14 | $327,900 |
Colleen Hurst | Javascript Developer | San Francisco | 39 | 2009/09/15 | $205,500 |
Sonya Frost | Software Engineer | Edinburgh | 23 | 2008/12/13 | $103,600 |
Jena Gaines | Office Manager | London | 30 | 2008/12/19 | $90,560 |
Quinn Flynn | Support Lead | Edinburgh | 22 | 2013/03/03 | $342,000 |
Charde Marshall | Regional Director | San Francisco | 36 | 2008/10/16 | $470,600 |
Haley Kennedy | Senior Marketing Designer | London | 43 | 2012/12/18 | $313,500 |
Tatyana Fitzpatrick | Regional Director | London | 19 | 2010/03/17 | $385,750 |
Michael Silva | Marketing Designer | London | 66 | 2012/11/27 | $198,500 |
Paul Byrd | Chief Financial Officer (CFO) | New York | 64 | 2010/06/09 | $725,000 |
Gloria Little | Systems Administrator | New York | 59 | 2009/04/10 | $237,500 |
JS CODE
$(document).ready(function() {
$('#exampletable').DataTable( {
dom: 'Bfrtip',
buttons: [
'copy', 'csv', 'excel', 'pdf', 'print'
]
} );
} );
CSS References
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Rajan Rawat
Rajan is a UI Developer, having good knowledge of HTML, CSS and javascript. His hobbies are internet surfing and watching sports.