New to Telerik UI for ASP.NET AJAXStart a free 30-day trial

Client-Side Programming Overview

The RadClientExportManager client-side object exposes the following client-side methods to control its behavior:

RadClientExportManager Client-Side Methods

NameParametersReturn TypeDescription
exportPDFDOM element, pdfSettings objectExport the passed DOM element to PDF. If the pdfSettings parameter is not passed, the control's default settings are used. (See Example 1)
exportImageDOM element, imageSettings objectExport the passed DOM element to an image file. If the imageSettings parameter is not passed, the control's default settings are used. The value set to the "width" and "height" properties should not be an empty string, otherwise an exception will be thrown.
exportSVGDOM element, svgSettings objectExport the passed DOM element to SVG. If the svgSettings parameter is not passed, the control's default settings are used. (See Example 1)
get_pdfSettingspdfSettings objectGet the PDF settings.
get_imageSettingsimageSettings objectGet the image settings.
get_svgSettingssvgSettings objectGet the SVG settings.
set_pdfSettingspdfSettings objectSet the PDF settings.
set_imageSettingsimageSettings objectSet the image settings.
set_svgSettingssvgSettings objectSet the SVG settings.

The pdfSettings, imageSettings and svgSettings are JavaScript objects that contain the properties you want to change. You can find an example for each object below in Example 1.

It is not required to change all available properties. For example in your pdfSettings object you can set only the filename. However, setting an empty string value for the "width" and "height" properties in imageSettings will throw an exception.

Example 1: A sample definition of pdfSettings, imageSettings and svgSettings objects.

JavaScript
<script type="text/javascript">
	var pdfSettings = {
		fileName: "PDF-Export",
		proxyURL: "http://www.proxy.com",
		margin: { top: 25, left: 15, bottom: 10, right: 5 },
		paperSize: "A4",
		landscape: "Portrait",
		title: "PDF",
		author: "UserName",
		subject: "Export to PDF",
		keywords: "a keyword",
		creator: "John",
		date: new Date(2015, 10, 25)
	};


	var imageSettings = {
		fileName: "Image-Export",
		proxyURL: "http://www.proxy.com",
		width: 200,
		heigh: 400,
	};

	var svgSettings = {
		fileName: "SVG-Export",
		proxyURL: "http://www.proxy.com",
		raw: false
	};
	
        function exportImage() {
            //get reference to the ClientExportManager object
            var exportManager = $find('<%=RadClientExportManager1.ClientID%>');
            //specify the image settings fileName, proxy, width, height
            var imageSettings = {
                fileName: "test.png",
                width: "1900px",
                height: "1000px"
             }
            //set the image settings
            exportManager.set_imageSettings(imageSettings);
            //export the element/container
            exportManager.exportImage($(".MyGrid"));
        }
</script>
<telerik:RadClientExportManager runat="server" ID="RadClientExportManager1"></telerik:RadClientExportManager>
<telerik:RadGrid RenderMode="Lightweight" runat="server" ID="GridView1" CssClass="MyGrid" DataSourceID="SqlDataSource1"></telerik:RadGrid>
<telerik:RadButton RenderMode="Lightweight" runat="server" OnClientClicked="exportImage" Text="Export RadGrid to Image" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>

See Also

In this article
See Also
Not finding the help you need?
Contact Support