Spsnyc 2016 JSLink Primer
-
Upload
michael-oryszak -
Category
Technology
-
view
852 -
download
0
Transcript of Spsnyc 2016 JSLink Primer
![Page 1: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/1.jpg)
JSLINK PRIMERUse JSLink to Deliver Rich Uis and Customizations
Mike Oryszak – B&R Business SolutionsSPS NYC – 7/30/2016
![Page 2: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/2.jpg)
ABOUT MESr Solution Architect w/ B&R Business Solutions
5x Microsoft SharePoint MVP (2010-2014)Dev and Architect on MS Stack since 1996
Working with SharePoint since 2002
@next_connect – http://mikeoryszak.com
![Page 3: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/3.jpg)
THANK YOUEVENT
SPONSORSWe appreciated you supporting the New York SharePoint Community!
• Diamond, Platinum, Gold, & Silver have tables scattered throughout
• Please visit them and inquire about their products & services
• To be eligible for prizes make sure to get your bingo card stamped by ALL sponsors
• Raffle at the end of the day and you must be present to win!
![Page 4: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/4.jpg)
CONFERENCE MATERIALS
• Slides / Demo will be posted on Lanyrd.com• http://lanyrd.com/2016/spsnyc
• Photos posted to our Facebook page• https://www.facebook.com/sharepointsaturdaynyc
• Tweet Us - @SPSNYC or #SPSNYC• Sign Up for our NO SPAM mailing list for all conference
news & announcements• http://goo.gl/7WzmPW
• Problems / Questions / Complaints / Suggestions• [email protected]
![Page 5: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/5.jpg)
• Visit ExtaCloud’s booth for wrist bands!
Scallywag's Irish Pub
508 9th Ave, between 38th & 39th. [6 minutes walk]
Scallywags also serves food.http://www.scallywagsnyc.com/
![Page 6: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/6.jpg)
OVERVIEW
• Rendering in SharePoint• What is JSLink?• Why use JSLink?• Script Registration• Examples• Closing
![Page 7: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/7.jpg)
RENDERING IN SHAREPOINT
• Traditionally SharePoint relied on server side processing (2001->2010)• XSLT based search results• List views• List forms• Dataview web part
• For efficiency (optimized downloads, faster rendering) MS moved to Client Side Rendering with SharePoint 2013• Scripts on Demand (SOD)• Processing/rendering with client side javascript code• Display templates for roll-up rendering
![Page 8: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/8.jpg)
WHAT IS JSLINK?
• JSLink supports binding a custom client side script to a list view, form, or app in order to override the default client side rendering
• With the injected script, you have control over when it fires (pre or post rendering)
• You can manipulate specific fields or the entire item
![Page 9: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/9.jpg)
WHY USE JSLINK?
• Supported method for tapping into the CSR flow• Can generate robust content displays• Can enhance forms for dependent dropdowns or data lookups• Can load other content, use conditional formatting, or add actions
![Page 10: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/10.jpg)
EXAMPLES
![Page 11: Spsnyc 2016 JSLink Primer](https://reader034.fdocuments.fr/reader034/viewer/2022051300/589cbf3f1a28ab8b018b5509/html5/thumbnails/11.jpg)
RESOURCES
• List Template Type Reference• https://msdn.microsoft.com/en-us/library/microsoft.sharepoint.client.listtemplatetype(v=office.15).aspx
• OfficeDev PnP: Samples• https://github.com/OfficeDev/PnP/tree/master/Samples/Branding.ClientSideRendering
• Using JSLink to Change the UI of SharePoint List/View• http://www.sharepointnutsandbolts.com/2013/01/using-jslink-to-change-ui-of-sharepoint_20.html
• Wes Preston – JSLink and CSR Examples• http://www.idubbs.com/blog/js-link-and-csr/