Kendo Grid with external buttons to export (Export to Excel, Export to PDF)
Source Code:-
<h2>Kendo Grid with external buttons to export (Export to Excel, Export to PDF)</h2> <button class="k-button k-primary" id="btnExportToPdf">Export to PDF</button> <button class="k-button k-primary" id="btnExportToExcel">Export to Excel</button> <br><br><br> <div id="Moviesgrid"></div> <link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.default.min.css"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.common.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script src="http://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script> <script src="http://kendo.cdn.telerik.com/2017.1.118/js/kendo.web.min.js"></script> <script src="http://kendo.cdn.telerik.com/2017.1.118/js/kendo.aspnetmvc.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.js"></script> <script> $(function () { var movies = [{ "rank": 1, "rating": 9.5, "year": 1999, "title": "The Shawshank Redemption" }, { "rank": 2, "rating": 9.4, "year": 1982, "title": "The Godfather" }, { "rank": 3, "rating": 9.1, "year": 1964, "title": "The Godfather: Part II" }, { "rank": 4, "rating": 8.9, "year": 1986, "title": "Il buono, il brutto, il cattivo." }, { "rank": 5, "rating": 8.9, "year": 1999, "title": "Pulp Fiction" }, { "rank": 6, "rating": 8.5, "year": 2015, "title": "12 Angry Men" }, { "rank": 7, "rating": 8.2, "year": 2000, "title": "Schindler's List" }, { "rank": 8, "rating": 7.8, "year": 2014, "title": "One Flew Over the Cuckoo's Nest" }, { "rank": 9, "rating": 6.8, "year": 2016, "title": "Inception" }, { "rank": 10, "rating": 6.5, "year": 2008, "title": "The Dark Knight" }]; $("#Moviesgrid").kendoGrid({ excel: { fileName: "Movies.xls", allPages: false, filterable: false }, pdf: { author: "www.code-view.com", creator: "alok singh", date: new Date(), fileName: "Movies.pdf", keywords: "Movies years ranks", landscape: false, margin: { left: 10, right: "10pt", top: "10mm", bottom: "1in" }, //paperSize: "A4", subject: "Movies rank wise list", title: "Movies rank wise list", allPages: false, avoidLinks: true, }, dataSource: { data: movies, pageSize: 10 }, sortable: true, pageable: true, columns: [ {field: "rank", title: "rank" }, { field: "rating", title: "rating" }, { field: "year", title: "year" }, { field: "title", title: "title" } ] }); $("#btnExportToExcel").kendoButton({ click: function () { $("#Moviesgrid").getKendoGrid().saveAsExcel(); } }); $("#btnExportToPdf").kendoButton({ click: function () { $("#Moviesgrid").getKendoGrid().saveAsPDF(); } }); }); </script>
No comments:
Post a comment