If you want to show a print preview page before printing any page, then you have to make a page like the one that currently is showing.
Or, if you want to print a particular section of that page, like only a
DataGrid, HTML table, or any other section, and you also need to preview that in a separate page before printing, you have to create a separate print preview page to show, which is more difficult for you.
I was developing a report module in my existing project. The report contents are generated dynamically by giving input (like generate by status, date range, etc). And, there is a print button to print. My client wanted to view a print preview page before printing, but we had already completed this module then. It was a really hard situation for my developers to build a print preview page for all the reports. I got this idea during that situation.
Using the code
You will just add the Script.js file in your project. The following code has been written in that file.
var pp = window.open();
pp.document.writeln('<LINK href=Styles.css type="text/css" rel="stylesheet">')
pp.document.writeln('<LINK href=PrintStyle.css ' +
'type="text/css" rel="stylesheet" media="print">')
pp.document.writeln('<body MS_POSITIONING="GridLayout" bottomMargin="0"');
pp.document.writeln(' leftMargin="0" topMargin="0" rightMargin="0">');
pp.document.writeln('<TABLE width=100%><TR><TD></TD></TR><TR><TD align=right>');
pp.document.writeln('<INPUT ID="PRINT" type="button" value="Print" ');
pp.document.writeln('<INPUT ID="CLOSE" type="button" ' +
getPrint(print_area) function takes the DIV ID of the section you want to print. Then, it creates a new page object and writes the necessary HTML tags, and then adds Print and Close buttons, and finally, it writes the
print_area content and the closing tag.
Call the following from your ASPX page. Here,
getPrint('print_area') has been added for printing the
print_area DIV section.
print_area is the DIV ID of the
DataGrid and the other two will work for others DIVs. Whatever areas you want to print must be defined inside of
DIV tags. Also include the Script.js file in the ASPX page.
Download the source code to get the
I have used the following code in the demo project to generate a sample
Private Sub PopulateDataGrid()
Dim dt As New System.Data.DataTable("table1")
Dim dr As Data.DataRow
dr = dt.NewRow
dr("UserID") = "1"
dr("UserName") = "Ferdous"
dr("Phone") = "+880 2 8125690"
dr = dt.NewRow
dr("UserID") = "2"
dr("UserName") = "Dorin"
dr("Phone") = "+880 2 9115690"
dr = dt.NewRow
dr("UserID") = "3"
dr("UserName") = "Sazzad"
dr("Phone") = "+880 2 8115690"
dr = dt.NewRow
dr("UserID") = "4"
dr("UserName") = "Faruk"
dr("Phone") = "+880 2 8015690"
DataGrid1.DataSource = dt
Use the following code in a separate style sheet page. See PrintStyle.css if you want to hide the Print and Close buttons during printing.
Points of interest
I was facing a problem during print. Print was not working the first time I clicked it. I solved that problem by reloading by using
location.reload(true); on that page.
- Second revision. Incorporated readers comments: Fleshed out several concepts, modified a few sections (sorry BigJim61, I think I have discussed more in my article now).
- First revision. Added a new section.
Ferdous has industry level experience with SharePoint and has done several presentations and workshops on SharePoint. He also worked as SharePoint Consultant (CREDEM Italy, Robi etc) and Trainer (BASIS, JAXARA IT, LEADS Co.). He is currently working as SharePoint Architect at BrainStation-23. He also worked as Technical Project Manager for Congral LLC for managing revolutionizing Patient Centric Healthcare applications at the same company since 2009.
Before joining here, he worked for OT Group SPA and for Rockwell Automation in Italy. He worked on many international projects during his professional life. The major projects are included below:
Internal Enterprise Portal for Robi, Dhaka
nVision Solution for nSales A/S, Denmark
Shared Care Plan for Congral LLC, USA
Internet Banking Portal for the Bank of CREDEM, Italy
Document Management (DMS) for the Bank of CREDEM, Italy
MES solution for Rockwell Automation, Italy
Tourism for Travel Curve Inc., USA
and so on...
He is the author of several technical articles with over 49 articles published on http://mrbool.com where he is the Technical Author for the site and author of mssharepointtips.com as well. He is also founder of SharePoint Expert group.
Looking for a Offshore Development or partnership.............. in any development in Dot.Net & Sharepoint 2007,2010 Platform.
Search him in google by 'MJ Ferdous' to get all links, articles, profile etc
Contact him: firstname.lastname@example.org email@example.com
Production troubleshooting, maintainability and scalability
Document Management Solution