This is a migrated thread and some comments may be shown as answers.

how to Print Grid Data With all paging ?

1 Answer 144 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Gadi asked on 03 Oct 2012, 09:29 AM

Hello,

To Print Grid Data With all paging & Filter Data, i use this program (from : http://www.telerik.com/community/forums/aspnet-ajax/grid/how-to-print-grid-data-with-all-paging.aspx ) :

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Testing.aspx.vb" Inherits="Aspen.Testing" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

<title>Telerik Print Fucntion</title>

<telerik:RadCodeBlock runat ="server" ID= "ClientExport">

<script type = "text/javascript" >

function getOuterHTML(obj){

if (typeof (obj.outerHTML) == 'undefined')

{

var divWrapper = document.createElement("div");

var copyOb = obj.cloneNode(true);

divWrapper.appendChild(copyOb);

return divWrapper.innerHTML

}

else

return obj.outerHTML;

}

function PrintRadGrid( ){

var radGrid = $find('RadGrid1');

var previewWnd = window.open('about:blank', '', '', false);

var sh =

'<%= ClientScript.GetWebResourceUrl(RadGrid1.GetType(),String.Format("Telerik.Web.UI.Skins.{0}.Grid.{0}.css",radGrid1.Skin)) %>';

var styleStr = "<html><head><link href = '" + sh + "' rel='stylesheet' type='text/css'></link></head>";

var htmlcontent = styleStr + '<body>' + getOuterHTML($find('RadGrid1').get_element()) + '</body></html>';

previewWnd.document.open();

previewWnd.document.write(htmlcontent);

previewWnd.document.close();

previewWnd.print();

previewWnd.close();

}

</script>

</telerik:RadCodeBlock>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings >

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID ="btnExport">

<UpdatedControls >

<telerik:AjaxUpdatedControl ControlID ="btnExport" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<div>

<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging ="true"

Width="493px" >

<ExportSettings FileName ="Hello" Excel-FileExtension ="xls" OpenInNewWindow ="true" IgnorePaging ="true" ></ExportSettings>

<MasterTableView>

<RowIndicatorColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="True" UseStaticHeaders="True" />

</ClientSettings>

</telerik:RadGrid>

</div>

<input ID="btnPrint" runat="server" type="button" onclick="PrintRadGrid();" value="Print Grid Data5" />

</form>

</body>

</html>

this solution works in IE and Firefox but it does not work in chrome. The result is empty.
Do you have this problem in Chrome? Do you have a solution in chrome?

1 Answer, 1 is accepted

answered on 12 Oct 2012, 01:45 PM

Hello Gadi,

The cause of the problem is that Chrome requires the page which is printed to be open when the print preview is configured.

You can use the following code in order to make the code library work under Chrome:

function PrintRadGrid()

{

var previewWnd = window.open('about:blank', '', '', false);

var sh =

'<%= ClientScript.GetWebResourceUrl(radGrid1.GetType(),String.Format("Telerik.Web.UI.Skins.{0}.Grid.{0}.css",radGrid1.Skin)) %>'

;

var styleStr = "<html><head><link href = '" + sh + "' rel='stylesheet' type='text/css'></link></head>";

var htmlcontent = styleStr + "<body>" + $find('<%= radGrid1.ClientID %>').get_element().outerHTML + "</body></html>";

previewWnd.document.open();

previewWnd.document.write(htmlcontent);

previewWnd.document.close();

previewWnd.print();

}

Kind regards,
Pavlina
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.