Thursday, August 15, 2013

Print option in SharePoint 2010 using JavaScript

You might came across a scenario where you need to allow the Users to Print part of the Page. This can be done through JavaScript, by finding the respective control and Print all the contents inside that Control by calling print() method in JavaScript.

Below code snippet will find the specified control in the Page and prints the contents inside that control.
 
function PrintWebPart() {
    var WebPartElementID = "printableArea"; // ID of the control to be printed
 
    var bolWebPartFound = false;
 
    if (document.getElementById != null) {
 
        //Create html to print in new window
 
        var PrintingHTML = '<HTML>\n<HEAD><meta name="WebPartPageExpansion" content="full" />\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 pgTitle = document.getElementById('pageTitle');
        title = "";
        if (pgTitle != null && pgTitle != undefined) {
            if (document.all) {
                title = pgTitle.innerText;
            } else {
                title = pgTitle.textContent;
            }
        }
        var currentDate = getCurrentDate();
        var header = "<table border='0' width='100%'><tr><td><h1><a href=\"/ " target=\"_blank\">Page</a></h1></td><td style='padding:5px;font-size: 1.1em;font-weight: bold;' align='right'>" + currentDate + "</td></tr><tr><td style=\"font-size: 1.3em;font-weight: bold;\">" + title + "</td></tr></table>";
 
        var WebPartData = document.getElementById(WebPartElementID);
        PrintingHTML += header;
        if (WebPartData != null && WebPartData != undefined) {
 
            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();
 
    }
 
}
 
function getCurrentDate() {
    var currentTime = new Date();
    var month = currentTime.getMonth() + 1;
    var day = currentTime.getDate();
    var year = currentTime.getFullYear();
    var currentDate = day + "-" + month + "-" + year;
    return currentDate;
 
}
 
 

 
Related Posts Plugin for WordPress, Blogger...