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

RadGrid Not Printing in Chrome

7 Answers 182 Views

Grid

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

Brian asked on 01 Sep 2015, 06:55 PM

Hi,

I'm attempting to print a RadGrid via JavaScript in Chrome. I'm getting one of two results:

A blank preview window appears and prints a blank page.
An error stating "Print preview failed" appears.

Everything works as intended in IE 11.

Here is my code. Thanks!

01.function RadButtonRCCPrint_ClientClick() {

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

03. var sh =

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

;

04. var styleStr =

"<html><head><style>.RadGrid_Windows7 .rgRow td, .RadGrid_Windows7 .rgAltRow td { border: solid 1px #000000; }</style><link href='"

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

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

06. previewWnd.document.open();

07. previewWnd.document.write(htmlContent);

08. previewWnd.document.close();

09. previewWnd.print();

10. previewWnd.close();

11.}

7 Answers, 1 is accepted

Accepted

answered on 02 Sep 2015, 01:17 PM

Hello Brian,

I have tested the approach demonstrated in the following Code Library and everything seems to work correctly in Chrome on my side:

Print RadGrid contents

Additionally, here is a simplified example with dummy data:

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

<script type="text/javascript">

function printGrid() {

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();

previewWnd.close();

}

</script>

</telerik:RadCodeBlock>

<telerik:RadButton runat="server" ID="RadButton1" AutoPostBack="false" Text="Print" OnClientClicked="printGrid"></telerik:RadButton>

<telerik:RadGrid runat="server" ID="RadGrid1" OnNeedDataSource="RadGrid1_NeedDataSource">

</telerik:RadGrid>

And the code-behind:

protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

{

DataTable table = new DataTable();

table.Columns.Add("field1", typeof(string));

table.Columns.Add("field2", typeof(string));

table.Columns.Add("field3", typeof(string));

table.Columns.Add("field4", typeof(string));

table.Columns.Add("field5", typeof(string));

table.Columns.Add("field6", typeof(string));

for (int i = 0; i < 5; i++)

{

table.Rows.Add("test", "test", "test", "test", "test", "test");

}

(sender as RadGrid).DataSource = table;

}

If the issue persists, please open a regular support ticket with a sample, runnable project attached, so we can test it locally and see what could cause the problem in your project.

Regards,
Konstantin Dikov
Telerik

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items

Accepted

answered on 16 Jun 2016, 05:57 PM

Add setTimeout to call print():

<script type="text/javascript" language="javascript">

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();

setTimeout(function () {

previewWnd.print();

previewWnd.close();

}, 50);

return false;

}

</script>