Printing SP 2013/2010 List Item jQuery and CSS

This solution is originated by ROB (My personal favarote author in SharePoint Blogs) at https://rstagg.com/2013/09/25/sharepoint-2013-printing-list-item-forms-using-jquery-and-css/




I just want to make this solution reach out to more people.


Calculated field for the print icon. 


Start from a new team site:

• Create a new subsite from the Collaboration template using the Team Site template.
• Use listprint for the site name and URL.
• Create a new picture library named “Images1”
• Upload the print icon to the picture library.  Download image here
• Create a custom list named “List”
• Add the following columns to the list:
• Column name: Printed | Column Type: Text | Default value: No
• Column name: Print Item | Column Type: Calculated Column  Download calculated field formula example here

• Add a new item to the list.
• Click on the new item link.
• From the standard DispForm.aspx page select Settings > Edit page
• Add a new Script Editor web-part to the page (located in the Media and Content Category in web part gallery)
• Set the Script Editor web-part properties zone index to 2 from the web part settings, layout section.
• Select Edit Snippet in the Script Editor webpart and paste in the following jQuery/CSS-Download script here
• Update the siteUrl variable in the jquery to use your site URL as required.
• Select Page, Stop Editing from the SharePoint ribbon.
• From site contents select “List”
• Select a link to one of the two items in the list, select the Print button.
• From site contents select “List” and notice the first item in the list has been updated to reflect Printed=Yes.

That’s it to getting started.