Help us shape the 2021 DevExtreme Roadmap.
Take our 5 minute survey.
Export to PDF (CTP)
Our DataGrid allows you to easily and accurately export its contents to a PDF document. To enable PDF export operations, you must reference or import the following:
-
jsPDF
A library that creates and manages PDF documents. -
jsPDF-AutoTable
A plugin that creates and manages tables in PDF documents.
Once you have referenced/imported all required resources, call the exportDataGrid(options) method that belongs to the pdfExporter module to export DataGrid content to a PDF document.
In this demo, the exportDataGrid(options) method is called when you click the Export to PDF button. Review the export code in the button's onClick handler to learn more.
NOTE
This functionality is available as a community technology preview (CTP). Should you have any questions or suggestions prior to its official release, please email your comments to support@devexpress.com. You can also share your feedback on this feature's discussion page.
Feel free to share demo-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you!
We appreciate your feedback.
We appreciate your feedback.
@section ExternalDependencies {
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.0.0/jspdf.umd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.5.9/jspdf.plugin.autotable.min.js"></script>
<script>
window.jsPDF = window.jspdf.jsPDF;
applyPlugin(window.jsPDF);
</script>
}
@(Html.DevExtreme().Button()
.ID("exportButton")
.Icon("exportpdf")
.Text("Export to PDF")
.OnClick("exportToPDF")
)
@(Html.DevExtreme().DataGrid<DevExtreme.NETCore.Demos.Models.Customer>()
.ID("gridContainer")
.Columns(columns => {
columns.AddFor(m => m.CompanyName);
columns.AddFor(m => m.Phone);
columns.AddFor(m => m.Fax);
columns.AddFor(m => m.City);
columns.AddFor(m => m.State)
.GroupIndex(0);
})
.AllowColumnReordering(true)
.ShowBorders(true)
.Grouping(grouping => grouping.AutoExpandAll(true))
.SearchPanel(searchPanel => searchPanel.Visible(true))
.GroupPanel(groupPanel => groupPanel.Visible(true))
.Paging(paging => paging.PageSize(10))
.DataSource(d => d.Mvc()
.Controller("DataGridCustomers")
.LoadAction("Get")
.Key("ID")
)
)
<script>
function exportToPDF() {
var doc = new jsPDF();
var dataGrid = $("#gridContainer").dxDataGrid("instance");
DevExpress.pdfExporter.exportDataGrid({
jsPDFDocument: doc,
component: dataGrid
}).then(function() {
doc.save("Customers.pdf");
});
}
</script>
using DevExtreme.NETCore.Demos.Models;
using DevExtreme.NETCore.Demos.Models.DataGrid;
using DevExtreme.NETCore.Demos.Models.SampleData;
using Microsoft.AspNetCore.Mvc;
using System.Linq;
namespace DevExtreme.NETCore.Demos.Controllers {
public class DataGridController : Controller {
public ActionResult ExportToPDF() {
return View();
}
}
}
using DevExtreme.AspNet.Data;
using DevExtreme.AspNet.Mvc;
using DevExtreme.NETCore.Demos.Models.SampleData;
using Microsoft.AspNetCore.Mvc;
using System;
using System.Collections.Generic;
using System.Linq;
namespace DevExtreme.NETCore.Demos.Controllers.ApiControllers {
[Route("api/[controller]")]
public class DataGridCustomersController : Controller {
[HttpGet]
public object Get(DataSourceLoadOptions loadOptions) {
return DataSourceLoader.Load(SampleData.Customers, loadOptions);
}
}
}
using System;
using System.Collections.Generic;
using System.Linq;
namespace DevExtreme.NETCore.Demos.Models {
public class Customer {
public int ID { get; set; }
public string CompanyName { get; set; }
public string Address { get; set; }
public string City { get; set; }
public string State { get; set; }
public int Zipcode { get; set; }
public string Phone { get; set; }
public string Fax { get; set; }
public string Website { get; set; }
}
}
using System;
using System.Collections.Generic;
using System.Linq;
namespace DevExtreme.NETCore.Demos.Models.SampleData {
public partial class SampleData {
public static readonly IEnumerable<Customer> Customers = new[] {
new Customer {
ID = 1,
CompanyName = "Premier Buy",
Address = "7601 Penn Avenue South",
City = "Richfield",
State = "Minnesota",
Zipcode = 55423,
Phone = "(612) 291-1000",
Fax = "(612) 291-2001",
Website = "http =//www.nowebsitepremierbuy.com"
},
new Customer {
ID = 2,
CompanyName = "ElectrixMax",
Address = "263 Shuman Blvd",
City = "Naperville",
State = "Illinois",
Zipcode = 60563,
Phone = "(630) 438-7800",
Fax = "(630) 438-7801",
Website = "http =//www.nowebsiteelectrixmax.com"
},
new Customer {
ID = 3,
CompanyName = "Video Emporium",
Address = "1201 Elm Street",
City = "Dallas",
State = "Texas",
Zipcode = 75270,
Phone = "(214) 854-3000",
Fax = "(214) 854-3001",
Website = "http =//www.nowebsitevideoemporium.com"
},
new Customer {
ID = 4,
CompanyName = "Screen Shop",
Address = "1000 Lowes Blvd",
City = "Mooresville",
State = "North Carolina",
Zipcode = 28117,
Phone = "(800) 445-6937",
Fax = "(800) 445-6938",
Website = "http =//www.nowebsitescreenshop.com"
},
new Customer {
ID = 5,
CompanyName = "Braeburn",
Address = "1 Infinite Loop",
City = "Cupertino",
State = "California",
Zipcode = 95014,
Phone = "(408) 996-1010",
Fax = "(408) 996-1012",
Website = "http =//www.nowebsitebraeburn.com"
},
new Customer {
ID = 6,
CompanyName = "PriceCo",
Address = "30 Hunter Lane",
City = "Camp Hill",
State = "Pennsylvania",
Zipcode = 17011,
Phone = "(717) 761-2633",
Fax = "(717) 761-2334",
Website = "http =//www.nowebsitepriceco.com"
},
new Customer {
ID = 7,
CompanyName = "Ultimate Gadget",
Address = "1557 Watson Blvd",
City = "Warner Robbins",
State = "Georgia",
Zipcode = 31093,
Phone = "(995) 623-6785",
Fax = "(995) 623-6786",
Website = "http =//www.nowebsiteultimategadget.com"
},
new Customer {
ID = 8,
CompanyName = "EZ Stop",
Address = "618 Michillinda Ave.",
City = "Arcadia",
State = "California",
Zipcode = 91007,
Phone = "(626) 265-8632",
Fax = "(626) 265-8633",
Website = "http =//www.nowebsiteezstop.com"
},
new Customer {
ID = 9,
CompanyName = "Clicker",
Address = "1100 W. Artesia Blvd.",
City = "Compton",
State = "California",
Zipcode = 90220,
Phone = "(310) 884-9000",
Fax = "(310) 884-9001",
Website = "http =//www.nowebsiteclicker.com"
},
new Customer {
ID = 10,
CompanyName = "Store of America",
Address = "2401 Utah Ave. South",
City = "Seattle",
State = "Washington",
Zipcode = 98134,
Phone = "(206) 447-1575",
Fax = "(206) 447-1576",
Website = "http =//www.nowebsiteamerica.com"
},
new Customer {
ID = 11,
CompanyName = "Zone Toys",
Address = "1945 S Cienega Boulevard",
City = "Los Angeles",
State = "California",
Zipcode = 90034,
Phone = "(310) 237-5642",
Fax = "(310) 237-5643",
Website = "http =//www.nowebsitezonetoys.com"
},
new Customer {
ID = 12,
CompanyName = "ACME",
Address = "2525 E El Segundo Blvd",
City = "El Segundo",
State = "California",
Zipcode = 90245,
Phone = "(310) 536-0611",
Fax = "(310) 536-0612",
Website = "http =//www.nowebsiteacme.com"
},
new Customer {
ID = 13,
CompanyName = "Super Mart of the West",
Address = "702 SW 8th Street",
City = "Bentonville",
State = "Arkansas",
Zipcode = 72716,
Phone = "(800) 555-2797",
Fax = "(800) 555-2171",
Website = "http://www.nowebsitesupermart.com"
},
new Customer {
ID = 14,
CompanyName = "Electronics Depot",
Address = "2455 Paces Ferry Road NW",
City = "Atlanta",
State = "Georgia",
Zipcode = 30339,
Phone = "(800) 595-3232",
Fax = "(800) 595-3231",
Website = "http =//www.nowebsitedepot.com"
},
new Customer {
ID = 15,
CompanyName = "K&S Music",
Address = "1000 Nicllet Mall",
City = "Minneapolis",
State = "Minnesota",
Zipcode = 55403,
Phone = "(612) 304-6073",
Fax = "(612) 304-6074",
Website = "http =//www.nowebsitemusic.com"
},
new Customer {
ID = 16,
CompanyName = "Tom's Club",
Address = "999 Lake Drive",
City = "Issaquah",
State = "Washington",
Zipcode = 98027,
Phone = "(800) 955-2292",
Fax = "(800) 955-2293",
Website = "http =//www.nowebsitetomsclub.com"
},
new Customer {
ID = 17,
CompanyName = "E-Mart",
Address = "3333 Beverly Rd",
City = "Hoffman Estates",
State = "Illinois",
Zipcode = 60179,
Phone = "(847) 286-2500",
Fax = "(847) 286-2501",
Website = "http =//www.nowebsiteemart.com"
},
new Customer {
ID = 18,
CompanyName = "Walters",
Address = "200 Wilmot Rd",
City = "Deerfield",
State = "Illinois",
Zipcode = 60015,
Phone = "(847) 940-2500",
Fax = "(847) 940-2501",
Website = "http =//www.nowebsitewalters.com"
},
new Customer {
ID = 19,
CompanyName = "StereoShack",
Address = "400 Commerce S",
City = "Fort Worth",
State = "Texas",
Zipcode = 76102,
Phone = "(817) 820-0741",
Fax = "(817) 820-0742",
Website = "http =//www.nowebsiteshack.com"
},
new Customer {
ID = 20,
CompanyName = "Circuit Town",
Address = "2200 Kensington Court",
City = "Oak Brook",
State = "Illinois",
Zipcode = 60523,
Phone = "(800) 955-2929",
Fax = "(800) 955-9392",
Website = "http =//www.nowebsitecircuittown.com"
}
};
}
}
#exportButton {
margin-bottom: 10px;
}