Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

SEF2013 - SharePoint Solutions with SPServices


Published on

SPServices is a widely used jQuery library that abstracts SharePoint's Web Services and makes them easier to use. It also includes functions that use the various Web Service operations to provide more useful (and cool) capabilities. It works entirely on the client and requires no server install.

Using SharePoint’s Web Services client-side, you can provide your users a more “tactile” experience.
In this class, you'll learn how to use SPServices to build a more compelling user experience on top of SharePoint. We'll look at the most popular ""value-added"" SPServices functions as well as how you can use SPServices as part of your own development toolkit. We’ll also discuss how you should think about migrating from SPServices to REST calls and when it makes sense.

Published in: Technology
  • Be the first to comment

SEF2013 - SharePoint Solutions with SPServices

  1. 1. SharePoint Solutions with SPServices Marc D Anderson
  2. 2. Who Is Marc? • Co-Founder and President of Sympraxis Consulting LLC, located in the Boston suburb of Newton, MA, USA. Sympraxis focuses on enabling collaboration throughout the enterprise using the SharePoint application platform. • More than 30 years of experience in technology professional services and software development. Over a wide-ranging career in consulting as well as line manager positions, Marc has proven himself as a problem solver and leader who can solve difficult technology problems for organizations across a wide variety of industries and organization sizes. • Three-time awardee of the Microsoft MVP award for SharePoint Server (2011, 2012, 2013).
  3. 3. What Is SPServices? SPServices is a jQuery library which abstracts SharePoint's Web Services and makes them easier to use. It also includes functions which use the various Web Service operations to provide more useful (and cool) capabilities. It works entirely client side and requires no server install. SharePoint's first [useful] client side object modelTM?
  4. 4. Where Does SPServices Work?
  5. 5. Where Do I Get SPServices?
  6. 6. What Else Do I Need?
  7. 7. How Does It All Fit Together?
  8. 8. Add More Plugins
  9. 9. Script from CDNs Referencing jQuery, jQueryUI, and SPServices from CDNs – Revisited Note the protocol-less references
  10. 10. What Can You Do with SPServices? • SPServices Core – Call SharePoint’s SOAP Web Services – Parse the returned XML to provide page content or user feedback – Make changes to SharePoint objects • Value-Added Functions – Enhance forms – Improve the user experience (UX)
  11. 11. SPServices’ Core Functions
  12. 12. Anatomy of an SPServices Call $().SPServices({ operation: "operationname", }); [webURL: "/sitepath",] [option1: value1,] [option2: value2,] [async: false,] completefunc: function (xData, Status) { stuff... }
  13. 13. Anatomy of an SPServices Call using Promises var thisPromise = $().SPServices({ operation: "operationname", [webURL: "/sitepath",] [option1: value1,] [option2: value2] }); thisPromise.done(function() { stuff... }); Promises were added in 2013.01 (jQuery 1.5+)
  14. 14. How Does an SPServices Call Work?
  15. 15. Parsing Results: GetListItems Example completefunc: function (xData, Status) { $(xData.responseXML).SPFilterNode("z:row").each(function() { var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>"; $("#tasksUL").append(liHtml); }); } <ul id="tasksUL"/>
  16. 16. Value-Added Functions • Combining multiple Web Services calls allows us to build cool functionality • Big focus on form enhancements to improve the overall user experience (UX) • The value-added functions are useful on their own but also can be used as prototypes for you to build your own functionality
  17. 17. SPCascadingDropdowns • Lets you set up cascading dropdowns on SharePoint forms (think Country / Region/ State/ City) • Enforces hierarchical relationships between column values using the GetListItems operation of the Lists Web Service to refresh the allowable values based on relationships which are maintained in reference lists • Users manage the relational content in reference lists
  18. 18. SPDisplayRelatedInfo
  19. 19. SPSetMultiSelectSizes
  20. 20. DEMOS
  22. 22. SharePoint 2013 SOAP Call with SPServices var thisPromise = $().SPServices({ operation: "GetListItems", listName: "Cities" }); thisPromise.done(function() { $(thisPromise.responseXML).SPFilterNode("z:row").each(function() { alert($(this).attr("ows_Title")); }); }); SOAP Web Services deprecated in SharePoint 2013
  23. 23. SharePoint 2013 REST Call $.ajax({ url: "/sites/marca/jquery/_api/web/lists/getbytitle('Cities')/items", type: "GET", headers: { "ACCEPT": "application/json;odata=verbose" }, success: function(data) { var results = data.d.results; for(i=0; i < data.d.results.length; i++) { alert(i + data.d.results[i].Title); } } }); How to: Complete basic operations using SharePoint 2013 REST endpoints Understanding and Using the SharePoint 2013 REST Interface
  24. 24. SharePoint 2013 JSOM Call var siteUrl = "/sites/marca/jQuery"; var clientContext = new SP.ClientContext(siteUrl); var oList = clientContext.get_web().get_lists().getByTitle('Cities' ); var camlQuery = new SP.CamlQuery(); camlQuery.set_viewXml('<View><Query></Query></View>'); this.collListItem = oList.getItems(camlQuery); clientContext.load(collListItem); clientContext.executeQueryAsync( Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed) ); How to: Complete basic operations using JavaScript library code in SharePoint 2013 function onQuerySucceeded(sender, args) { var listItemInfo = ''; var listItemEnumerator = collListItem.getEnumerator(); while (listItemEnumerator.moveNext()) { var oListItem = listItemEnumerator.get_current(); alert(oListItem.get_item('Title').toString()); } } function onQueryFailed(sender, args) { alert('Request failed. ' + args.get_message() + 'n' + args.get_stackTrace()); }
  25. 25. Contact Information eMail Blog SPServices SPXSLT Books The Middle Tier Manifesto