Hello Friends
User wants to print the available listitems of a list from a ListViewWebpart in a page and they want to print only those records rather than entire page content (Left Navigation, breadcrumbs etc.) .
So we could not provide the "print" functionality from the browser so we have to include below javascript inside the Content Editor Webpat and now you have print functionality available for ListView webpart only.
Add a content editor webpart on same page where your ListViewWebpart resides.
Write this javascript in the content editor webpart.
<input onclick="javascript:void(PrintWebPart())" type="button" value="Print Page"/> <!-- copy and paste in to a content editor source editor web part --><script language="JavaScript">
<!-- Web Part/region to print -->
var WebPartElementID = "MSO_ContentTable";
//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.print();
}
}</script>
Now you all set for print the listitems of listviewwebpart in SharePoint Pae.
Disha Shah
User wants to print the available listitems of a list from a ListViewWebpart in a page and they want to print only those records rather than entire page content (Left Navigation, breadcrumbs etc.) .
So we could not provide the "print" functionality from the browser so we have to include below javascript inside the Content Editor Webpat and now you have print functionality available for ListView webpart only.
Add a content editor webpart on same page where your ListViewWebpart resides.
Write this javascript in the content editor webpart.
<input onclick="javascript:void(PrintWebPart())" type="button" value="Print Page"/> <!-- copy and paste in to a content editor source editor web part --><script language="JavaScript">
<!-- Web Part/region to print -->
var WebPartElementID = "MSO_ContentTable";
//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.print();
}
}</script>
Now you all set for print the listitems of listviewwebpart in SharePoint Pae.
Disha Shah
Hello Disha,
ReplyDeleteThis is an excellent post although I am having an issue. I have followed the post and the print button is visible but when I click on it, I see the Title of the webpart but not the content. Am I missing something here?
Thanks,
Ricky
Hi Ricky
DeleteThank you for the appreciation!
Would you please let me know what is the order of the webpart inside the page?which one is first and second?
1. List webpart
2. Content Editor Part
Thanks
Disha Shah
Thanks for the reply.
DeleteContent Editor Webpart is the top one and List webpart is the one below it. Should it be the opposite?
I changed the order and that didn't resolve the issue either.
DeleteThanks,
Ricky
Hi Ricky
DeleteOkay. could you please change this line?
var WebPartElementID = "MSO_ContentTable";
to
1. var WebPartElementID = "ctl00_MSO_ContentDiv";
2.--if first option does not work then try this
var WebPartElementID = "onetIDListForm:;
Let me know if it helps or not
Thanks
Disha Shah
Hi Ricky
ReplyDeleteOkay. could you please change this line?
var WebPartElementID = "MSO_ContentTable";
to
1. var WebPartElementID = "ctl00_MSO_ContentDiv";
2.--if first option does not work then try this
var WebPartElementID = "onetIDListForm:;
Let me know if it helps or not
Thanks
Disha Shah
Hi Disha,
ReplyDeleteThat worked but I was wondering the way it works is that it opens a new page without any side bar and branding etc...which is great. But is it possible that it opens directly the Print box rather than opening the list.
Cheers,
Ricky
Hi Ricky
DeleteYou could not open direclty the print box.
But you could do one thing when user click "print" or "cancel" from print box ; it will close the list window automatically.
For that write below line after
PrintingWindow.print();
PrintingWindow.close();
Thanks
Disha Shah
Thanks Disha for all your help.
ReplyDeletehello i am using the above script for printing list which is customized in infopath form the new popup is opening with the form which i want to print but popup does not contain the print opeion neither it is automatically printing please help
ReplyDeleteThis will print only page 1, if the list view webpart has paging.
ReplyDelete