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

Problems with printer friendly grid

1 Answer 100 Views

Grid

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

Tom Rasmussen asked on 09 Oct 2012, 07:14 PM

Printer-Friendly-Window.png

Print-output-1.png

Print-output-2.png

Print-output-3.png

I'm having some issues with the display of a RadGrid in a printer friendly window. I have a simple RadWindow that combines multiple elements (RadGrids and other divs) into a single printable flow. When the window is opened the following code runs to generate the content:

var multiPage = $find('<%= InquiryDetailNotesMultiPage.ClientID %>');

var tabStrip = $find("<%= InquiryDetailNotesTabStrip.ClientID %>");

var baseId = "<%= CombinedNotesArea.ClientID %>".replace("CombinedNotesArea", "");

var baseGridId = "<%= InquiryDetailCombinedGrid.ClientID %>".replace("InquiryDetailCombinedGrid", "");

var views = multiPage.get_pageViews();

var tabs = tabStrip.get_tabs();

var additionalInformationHtml = "";

for (var i = 0; i< views.get_count(); i++) {

var view = views.getPageView(i);

var tab = tabs.getTab(i);

var grid = $find(baseGridId + "InquiryDetail" + tab.get_text().replace(" ", "") + "Grid");

if (grid) {

additionalInformationHtml = "Additional Information - ";

additionalInformationHtml += tab.get_text();

additionalInformationHtml += view.get_element().children[0].outerHTML;

}

document.getElementById(baseId + tab.get_text().replace(" ", "") + "NotesArea").innerHTML = additionalInformationHtml;

}

This basically iterates a tabstrip/multipage and grabs the grids on each then takes injects the html of each into a pre-defined area on "Print Preview" window. This works fine and the content looks correct. After clicking a print button a separate script is called that takes this content and passes it to an iFrame and calls print() as described here: http://www.telerik.com/support/kb/aspnet-ajax/window/printing-the-contents-of-a-radwindow.aspx. I am also trying to maintain the grid styles as described here: http://www.telerik.com/community/code-library/aspnet-ajax/grid/print-radgrid-contents.aspx. This is my print function:

function CallPrint() {

var content = $get("<%= PrintableArea.ClientID %>").innerHTML;

var styleSheet =

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

;

var baseStyleSheet =

'<%= Telerik.Web.SkinRegistrar.GetWebResourceUrl(Page, InquiryDetailOnlineActivityGrid.GetType(), "Telerik.Web.UI.Skins.Grid.css") %>'

;

//remove any script elements

content = content.replace( /<script .*?>(.|\n)*?<\/script>/gi , "");

var printIframe = $get("ifmcontentstoprint");

var printDocument = printIframe.contentWindow.document;

printDocument.designMode = "on";

printDocument.open();

printDocument.write("<html><head><link href = '" + styleSheet + "' rel='stylesheet' type='text/css'><link href = '" + baseStyleSheet + "' rel='stylesheet' type='text/css'></head><body>" + content + "</body></html>");

printDocument.close();

try {

if (document.all) {

printDocument.execCommand("Print", null, false);

}

else {

printIframe.contentWindow.print();

}

catch (ex) {

alert("error printing");

}

Unfortunately what comes back is a little odd. Not all of the styling is there and the print appears to be inserting some odd page breaks based on the content. See attached screenshots for examples. I'm sure I'm missing something simple here. Any help would be appreciated.

Problems with printer friendly grid

1 Answer, 1 is accepted