Your SlideShare is downloading. ×
Share point saturday presentation 9 29-2012-2
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Share point saturday presentation 9 29-2012-2


Published on

SharePoint Saturday presentation, Detroit, Sept 29, 2012

SharePoint Saturday presentation, Detroit, Sept 29, 2012

Published in: Technology

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. Local Touch – Global ReachJavascript-Based Solutionsin SharePoint 2010Derek GusoffSenior ConsultantSogeti USA
  • 2. About Me Derek Gusoff Senior Consultant with Sogeti USA since 2008 @dgusoff 2Local Touch – Global Reach
  • 3. Agenda • Why JavaScript? • A story • A defense of JavaScript • jQuery (with demos!) • Accessing data in SharePoint – ASMX web services / SPServices – REST interface – Client Object Model (with demos!) • Debugging and Troubleshooting • The OOB JavaScript files • Case Study • Q&A • The craziest thing I’ve ever done in JavaScript 3Local Touch – Global Reach
  • 4. Why JavaScript? • SharePoint provides a UI right out of the box • It doesn’t always meet all our needs • JavaScript can fill the gap between standard functionality and your organization’s unique business requirements. 4Local Touch – Global Reach
  • 5. A Story 5Local Touch – Global Reach
  • 6. The trouble with JavaScript 6Local Touch – Global Reach
  • 7. jQuery 7Local Touch – Global Reach
  • 8. Three things jQuery does extremely well • Manipulate the DOM • Make AJAX calls • Handle Events 8Local Touch – Global Reach
  • 9. jQuery Selector syntax Note: the $ function always returns an array 9Local Touch – Global Reach
  • 10. jQuery AJAX calls 10Local Touch – Global Reach
  • 11. jQuery Events • A simple, easy-to-use method for subscribing to events in the web page • The ready() event – executes when the page DOM is loaded • An example of a click handler • 11Local Touch – Global Reach
  • 12. jQuery Demo 12Local Touch – Global Reach
  • 13. SharePoint JavaScript APIs • ASMX web services – SOAP-based – Lots of functionality not available anywhere else – Supposedly deprecated in SP2013 but still supported – Search – User Profilles – Versions – FBA – Social Data – Sites, Webs, Lists, Views, Content Types 13Local Touch – Global Reach
  • 14. ASMX Web Services 14Local Touch – Global Reach
  • 15. SPServices • Third-party jQuery-based library for SharePoint • Available at • You can think of it as a wrapper for the ASMX web services but it’s more than that. 15Local Touch – Global Reach
  • 16. SPServices 16Local Touch – Global Reach
  • 17. REST Interface • A RESTful way to access SharePoint List data • The REST interface has been completely replaced in SP2013, so any 2010 development will need to be redone after upgrade to 2013. • URL-based syntax 17Local Touch – Global Reach
  • 18. REST Interface 18Local Touch – Global Reach
  • 19. Client Side Object Model (CSOM) • Provides a programming interface familiar to .NET developers • The preferred method for interacting with SharePoint in JavaScript in 2010 and 2013 • Uses a web service called Client.svc under the hood. • Asynchronous operation • Limitations – Unlike REST or ASMX, the CSOM is scoped to a site collection – Limited to operations within a site collection 19Local Touch – Global Reach
  • 20. Client Side Object Model (CSOM) 20Local Touch – Global Reach
  • 21. Client Side Object Model (CSOM) Demos 21Local Touch – Global Reach
  • 22. Debugging tools and techniques • Internet Explorer Developer Tools (F12) • Visual Studio • Fiddler 22Local Touch – Global Reach
  • 23. Provisioning JavaScript to SharePoint “The evolution of a SharePoint Developer” • Content Editor Web Part • SharePoint Designer • Visual Studio Solution package 23Local Touch – Global Reach
  • 24. Referencing JavaScript files in SharePoint pages • <script> tag in page • <script> tag in Master page • <CustomAction Location=“ScriptLink” • Try to put commonly used functionality in common files referenced across the site • Try to put page-specific code in files referenced only in that page or pages 24Local Touch – Global Reach
  • 25. OOB SharePoint JavaScript files • To view debug version of SharePoint’s JavaScript files: • Modify this element on the web app’s web.config: • <compilation batch="false" debug="true"> • Interesting files to check out; • Core.js • SP.js – The “SP.*js” files represent the client object model • Init.js • Form.js 25Local Touch – Global Reach
  • 26. Reference Implementation: Filtered Lookups Requirements • Need a way to filter lookups by user-entered criteria • Also need a default search filter( only open projects, for example) • Need to support a variety of search operators(Equal, Not Equal, Contains) • NO Code allowed 26Local Touch – Global Reach
  • 27. Filtered Lookups – Design considerations • The list architecture for lookups does not need to change – only the user interface • We only need to change the user interface(manipulate the DOM) • We need a way to generate (on the fly) a query, merge it with a default query, send it to SharePoint, and process the results • We can use jQuery to hide the default lookups and replace with our own • We can launch a form in a dialog to capture the user’s query • We can use the Client Object model to create our query, fetch the desired results and place them back into the form 27Local Touch – Global Reach
  • 28. Filtered Lookups Demo 28Local Touch – Global Reach
  • 29. The craziest thing I ever did with JavaScript 29Local Touch – Global Reach
  • 30. Local Touch – Global Reach Thank you