Add Print Option to SharePoint Page to print one particular web Part using Content Editor Web Part
When the javascript code point to a particular Web Part by its web part ID, then the print option will try to print only the chosen web part.
<input type="button" ID="printBtn1" OnClick="javascript:void(PrintWebPart())" value="Print only tranSMART WebPart">
<script language="JavaScript">
//Controls which Web Part or zone to print
var WebPartElementID = "WebPartWPQ2";
//Function to print Web Part
function PrintWebPart()
{
var bolWebPartFound = false;
if (document.getElementById != null)
{
//Create html to print in new window
var PrintingHTML = '<HTML>\n<HEAD>\n';
//Take data from Head Tag
if (document.getElementsByTagName != null)
{
var HeadData= document.getElementsByTagName("HEAD");
if (HeadData.length > 0)
PrintingHTML += HeadData[0].innerHTML;
}
PrintingHTML += '\n</HEAD>\n<BODY>\n';
var WebPartData = document.getElementById(WebPartElementID);
if (WebPartData != null)
{
PrintingHTML += WebPartData.innerHTML;
bolWebPartFound = true;
}
else
{
bolWebPartFound = false;
alert ('Cannot Find Web Part');
}
}
PrintingHTML += '\n</BODY>\n</HTML>';
//Open new window to print
if (bolWebPartFound)
{
var PrintingWindow = window.open("","PrintWebPart", "toolbar,width=800,height=600,scrollbars,resizable,menubar");
PrintingWindow.document.open();
PrintingWindow.document.write(PrintingHTML);
// Open Print Window
PrintingWindow.window.print();
PrintingWindow.document.close();
}
}
</script>
We can find the web part ID by viewing the source of a page.
Leave your comments below.
1 comment:
Great! I do have a problem though....
The above works perfect for my display/edit InfoPath Forms. But I also want my customers to be able to fill out the InfoPath Form and Print it right there and there (print the new form)
My issue is: I have a date picker field. After I fill out the form and hit your "print" button, prior to the form being saved/submitted, everything comes up as it is supposed to, but then a date picker calendar pops up from my date field. If I continue and hit print, the mini calendar is the only thing that prints. Any clue on why that happens? Is there code and can put into your code to not allow the date picker to pop up?
Help!!
Post a Comment