Supporters of End User
Web

JQuery for Everyone: Print (Any) Web Part(s) Plugin

 
Item is currently unrated. Press SHIFT+ENTER to rate this item.1 star selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+ESCAPE to leave rating submit mode.2 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.3 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.4 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.5 stars selected. Press SHIFT+ENTER to submit. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.
Categories: 
As I build up to the new, enhanced Preview Pane code, I want to highlight some of the more modular features it will have.

Find Something, Do Something With It

I improved the Print Any Web Part code and, once again, made it "plugin-style." Now you can write your own links by using a selector, like $("#WebPartWPQ1"), and add the .print() method. You can also add css instructions like so: print(css:".ms-toolbar{display:none;}").

Mash It Up!

If you mash this up with my other plugin, SharePoint Client-Side Object Model, you can find web parts no matter where they are on the page or which order they load in: $("#"+wp.Tasks2.id).add("#"+wp.Calendar.id).print().
<script type="text/javascript">
if(typeof jQuery=="undefined"){
	var jQPath="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/"; 
	document.write("<script src='",jQPath,"jquery.min.js' type='text/javascript'><\/script>");
}
</script>
<script type="text/javascript">
(function(){
	jQuery.fn.print = function(options){
		var o = $.extend({css:"",},options);
		var html = 	"<HTML>\n<HEAD>\n<style type='text/css'>\n"+
					options.css+"</style>"+
					$("head").html()+"\n</HEAD>\n<BODY>\n";
		this.each(function(i,e){
			html += "<DIV style='font-family:verdana,arial,helvetica,"+
					"sans-serif;font-size:8pt;margin:20px;'>\n"+
					$(e).html()+"</DIV>\n";
		});
			html += "</BODY>\n</HTML>";
		var printWP = window.open("","printWebPart");
		printWP.document.open();
		printWP.document.write(html);
		printWP.document.close();
		printWP.print();
		return this;
	};
})();
</script>
Paul Grenier

Comments

Mike Slomanski

JQuery for Everyone: Print (Any) Web Part(s) Plugin

I do not understand what I would do with this code or where to put it.?. Sorry if it is obvious. Looks useful.

Posted 30-Apr-2009 by Mike Slomanski
flume

JQuery for Everyone: Print (Any) Web Part(s) Plugin

I agree with Mike. Would be nice with a simple example...

Posted 12-May-2009 by flume
Frank

JQuery for Everyone: Print (Any) Web Part(s) Plugin

I added the code to my test site and it works. I have a few problems.
1. How do I get the calendar to print on one page?
2. How do I get it to work with other web parts? Here are some examples: (Hidden) Cross-Site Menu, (Hidden) LoadTip Live and other 'great stuff' I got from EndUsersSharePoint.
I add it to the site and only the print code works.
Hope you can help.

Posted 27-May-2009 by Frank
AutoSponge

JQuery for Everyone: Print (Any) Web Part(s) Plugin

@Frank,

1. I'm guessing that the calendar will print to a single page if you can adjust your print settings. If not, you're allowed to pass custom CSS instructions in the call to $.print(). See the example in this article.

2. Check the versions of jQuery you're using. If you're mashing up web parts, make sure you use the same version everywhere.

As for making specific code work together, I can only speak for my own creations and I never tested this with LoadTip Live.

Posted 28-May-2009 by AutoSponge
Pearl Tech » Blog Archive » Printer Friendly jQuery

JQuery for Everyone: Print (Any) Web Part(s) Plugin

[...] friendly web content is another hurdle for application developers. I recently came across some useful jQuery for printing Sharepoint web parts. The idea was pure genius – wrap the bit of HTML you want [...]

Posted 23-Sep-2009 by Pearl Tech » Blog Archive » Printer Friendly jQuery
JQuery for Everyone: Minimal AOP and Elegant Modularity | EndUserSharePoint.com

JQuery for Everyone: Print (Any) Web Part(s) Plugin

[...] two basic options for creating “plugins” (extensions of the jQuery library). Like my Print Any Web Parts code, you can create a jQuery method by using jQuery.prototype. or the pseudonym, [...]

Posted 16-Dec-2009 by JQuery for Everyone: Minimal AOP and Elegant Modularity | EndUserSharePoint.com
Charlie Epes

JQuery for Everyone: Print (Any) Web Part(s) Plugin

Hi Paul:
Would you give us some help on how to install and utilize this plug-in?

Thanks-

Charlie Epes

Posted 04-Mar-2010 by Charlie Epes
AVIKA

JQuery for Everyone: Print (Any) Web Part(s) Plugin

If I have 1000+ items, will it print page by page or you can all the pages?

Posted 05-Mar-2010 by AVIKA
Sam

JQuery for Everyone: Print (Any) Web Part(s) Plugin

Here is a simpler version of this code.

It not jquery, but to be honest theres hardly a need for jquery on small functions like these..

function print() {
var a = window.open('', '', 'scrollbars=yes,width=850,height=650');
a.document.open("text/html");
a.document.write('');
a.document.write(document.getElementById('print').innerHTML);
a.document.write('');
a.document.close();
a.print();
}

Posted 22-Mar-2010 by Sam
EndUserSharePoint

JQuery for Everyone: Print (Any) Web Part(s) Plugin

Thanks Sam. I'm in agreement that some of the things I'm seeing can be done with a simple javascript function as opposed to making a call to jQuery. Specifically, some of the interface enhancements available could just as easily be one with plain CSS in a CEWP. -- Mark

Posted 22-Mar-2010 by EndUserSharePoint
AutoSponge

JQuery for Everyone: Print (Any) Web Part(s) Plugin

@Sam,

Thanks for your suggestion. However, your script does not preserve the CSS/style used on the area being printed. You also neglected to mention that your version does not work in SharePoint because there is no element with id=print. I'll also add, that part of this script's utility is that it does not clog the global namespace with a generic name like yours, it extends jQuery instead--which followers of this article are already using for many other solutions.

I'll admit, I wrote this a long time ago, and probably would write better version today, but when I offered this, I tested it in multiple browsers in SharePoint--your code is just a copy-paste example from somewhere else.

Posted 22-Mar-2010 by AutoSponge

Notify me of comments to this article

E-mail:
   

Add Comment

Title:

 
Comment:
Email:

   


Name:

 
Url: