Share point saturday presentation 9 29-2012-2

  • 900 views
Uploaded on

SharePoint Saturday presentation, Detroit, Sept 29, 2012

SharePoint Saturday presentation, Detroit, Sept 29, 2012

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
900
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
10
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Local Touch – Global ReachJavascript-Based Solutionsin SharePoint 2010Derek GusoffSenior ConsultantSogeti USA www.us.sogeti.com
  • 2. About Me Derek Gusoff Senior Consultant with Sogeti USA since 2008 @dgusoff http://derekgusoff.wordpress.com derek.gusoff@us.sogeti.com www.us.sogeti.com 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 www.us.sogeti.com 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. http://www.leadersintheknow.biz www.us.sogeti.com 4Local Touch – Global Reach
  • 5. A Story http://www.learningjquery.com/ www.us.sogeti.com 5Local Touch – Global Reach
  • 6. The trouble with JavaScript http://blogs.claritycon.com/blog/ www.us.sogeti.com 6Local Touch – Global Reach
  • 7. jQuery www.us.sogeti.com 7Local Touch – Global Reach
  • 8. Three things jQuery does extremely well • Manipulate the DOM • Make AJAX calls • Handle Events www.us.sogeti.com 8Local Touch – Global Reach
  • 9. jQuery Selector syntax Note: the $ function always returns an array http://api.jquery.com/category/selectors/ www.us.sogeti.com 9Local Touch – Global Reach
  • 10. jQuery AJAX calls http://api.jquery.com/jQuery.ajax/ www.us.sogeti.com 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 • http://api.jquery.com/category/events/ www.us.sogeti.com 11Local Touch – Global Reach
  • 12. jQuery Demo www.us.sogeti.com 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 http://msdn.microsoft.com/en-us/library/ee705814.aspx www.us.sogeti.com 13Local Touch – Global Reach
  • 14. ASMX Web Services www.us.sogeti.com 14Local Touch – Global Reach
  • 15. SPServices • Third-party jQuery-based library for SharePoint • Available at http://spservices.codeplex.com/ • You can think of it as a wrapper for the ASMX web services but it’s more than that. www.us.sogeti.com 15Local Touch – Global Reach
  • 16. SPServices www.us.sogeti.com 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 www.us.sogeti.com 17Local Touch – Global Reach
  • 18. REST Interface www.us.sogeti.com 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 www.us.sogeti.com 19Local Touch – Global Reach
  • 20. Client Side Object Model (CSOM) www.us.sogeti.com 20Local Touch – Global Reach
  • 21. Client Side Object Model (CSOM) Demos www.us.sogeti.com 21Local Touch – Global Reach
  • 22. Debugging tools and techniques • Internet Explorer Developer Tools (F12) • Visual Studio • Fiddler www.us.sogeti.com 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 www.us.sogeti.com 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 www.us.sogeti.com 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 www.us.sogeti.com 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 www.us.sogeti.com 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 www.us.sogeti.com 27Local Touch – Global Reach
  • 28. Filtered Lookups Demo www.us.sogeti.com 28Local Touch – Global Reach
  • 29. The craziest thing I ever did with JavaScript http://blogs.claritycon.com/blog/ www.us.sogeti.com 29Local Touch – Global Reach
  • 30. Local Touch – Global Reach Thank you www.us.sogeti.com