开发者

Print Partial Page and Show Partial Page in New Window Asp.Net

开发者 https://www.devze.com 2023-04-04 10:14 出处:网络
How do you Print a Partial Page? How do you Show a Partial Page in New Window? Then User Prints. 开发者_如何学Go
  1. How do you Print a Partial Page?

  2. How do you Show a Partial Page in New Window? Then User Prints.

开发者_如何学Go

Note: The partial page is in an IFrame.


You have some limitations when printing the contents of an IFrame. JavaScript security policies will prevent you from printing something if its in a different domain. This is the method I've used for years to print specific content on a page.

First you need a simple print function in JavaScript. This is the one I use

    print = function(str) {
    var WinPrint = window.open('', '', 'left=0,top=0,width=1,height=1,toolbar=0,scrollbars=0,status=0');
    WinPrint.document.open("text/html", "replace");
    WinPrint.document.write('<html><head><title>Printing</title></head><body>');
    WinPrint.document.write(str);
    WinPrint.document.write('</body></html>');
    WinPrint.document.close();
    WinPrint.focus();
    WinPrint.print();
    WinPrint.close();
};

Then you need to pull the HTML from the iframe

   getIFrameContent = function(IFrameID) {
    return document.getElementById(IFrameID).contentWindow.document.body.innerHTML;
};

Then a simple function to wrap the whole thing to make it easier

printIFrame = function(IFrameID) {
    print(getIFrameContent(IFrameID));
};

Once you have all that you can call the printIFrame method and simply send in the ID of the IFrame.

Method 2: Open the Iframe in a new window and print that window.

 var printIFrame2 = function (IFrameID) {
        var URL = document.getElementById(IFrameID).getAttribute("src");
        var WinPrint = window.open(URL, 'WinPrint', 'left=0,top=0,width=1,height=1,toolbar=0,scrollbars=0,status=0');
        WinPrint.focus();
        WinPrint.print();
        WinPrint.close();
    };


I don't know else to post code unless i ask a question. So for Cris is this what you menat is to put javascript in main page like so?

 <script type="text/javascript">
    print = function (str) {
        var WinPrint = Window.open('', '', 'left=0,top=0,width=1,height=1,toolbar=0,scrollbars=0,status=0');
        WinPrint.document.open("");
        WinPrint.document.write('');
        WinPrint.document.write(str);
        WinPrint.document.write('</body></html>');
        WinPrint.document.close();
        WinPrint.focus();
        WinPrint.print();
        WinPrint.close();
    };
    getIFrameContent = function (IFrameID) {
        return document.getElementById(IFrameID).contentWindow.document.body.innerHTML;
    };
    printIFrame = function (IFrameID) {
        print(getIFrameContent(IFrameID));
    };

</script>

Then call from code behind like so...

ScriptManager.RegisterStartupScript(Page, Me.GetType(), "key", "printIFrame(" & MyIFrame.ID & ");", True)


This is tested by me:

Printable portion of the page:

<div id="printArea">
     <h1>I am going to print from here</h1>
     <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>

Print Button:

<a href="#" onClick="printDiv();return false;">Print</a>

Javascript Code:

function printDiv() {
    var w = window.open('', '','width=auto,height=auto,resizeable,scrollbars');
    w.document.write($("#printArea").html());
    w.document.close();
    javascript:w.print();
    w.close();
    return false;
}
0

精彩评论

暂无评论...
验证码 换一张
取 消