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.


Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

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