SEF2013 - SharePoint Solutions with SPServices

  • 2,074 views
Uploaded 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 …

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.

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
No Downloads

Views

Total Views
2,074
On Slideshare
0
From Embeds
0
Number of Embeds
15

Actions

Shares
Downloads
45
Comments
0
Likes
1

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. SharePoint Solutions with SPServices Marc D Anderson
  • 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. 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. Where Does SPServices Work?
  • 5. Where Do I Get SPServices? http://spservices.codeplex.com/
  • 6. What Else Do I Need? http://jquery.com
  • 7. How Does It All Fit Together?
  • 8. Add More Plugins
  • 9. Script from CDNs Referencing jQuery, jQueryUI, and SPServices from CDNs – Revisited http://sympmarc.com/2013/02/07/referencing-jquery-jqueryui-and-spservices-from-cdns-revisited/ Note the protocol-less references
  • 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. SPServices’ Core Functions
  • 12. Anatomy of an SPServices Call $().SPServices({ operation: "operationname", }); [webURL: "/sitepath",] [option1: value1,] [option2: value2,] [async: false,] completefunc: function (xData, Status) { ...do stuff... }
  • 13. Anatomy of an SPServices Call using Promises var thisPromise = $().SPServices({ operation: "operationname", [webURL: "/sitepath",] [option1: value1,] [option2: value2] }); thisPromise.done(function() { ...do stuff... }); Promises were added in 2013.01 (jQuery 1.5+)
  • 14. How Does an SPServices Call Work?
  • 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. 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. 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. SPDisplayRelatedInfo
  • 19. SPSetMultiSelectSizes
  • 20. DEMOS
  • 21. RETRIEVING SHAREPOINT LIST DATA
  • 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")); }); }); http://spservices.codeplex.com SOAP Web Services deprecated in SharePoint 2013
  • 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 http://msdn.microsoft.com/en-us/library/jj164022.aspx Understanding and Using the SharePoint 2013 REST Interface http://msdn.microsoft.com/en-us/magazine/dn198245.aspx
  • 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 http://msdn.microsoft.com/en-us/library/jj163201.aspx 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. Contact Information eMail marc.anderson@sympraxisconsulting.com Blog http://sympmarc.com SPServices http://spservices.codeplex.com SPXSLT http://spxslt.codeplex.com Books http://sympmarc.com/books The Middle Tier Manifesto http://bit.ly/middletier