200 likes | 313 Views
Spicing Up Web Parts. Randy Williams SharePoint Hawaii User Group May 11, 2011. About the Speaker. US-West Coast Manager for Synergy Based in San Diego, California Consultant/Trainer/Author SharePoint MVP Specialty in architecting s olutions Blog: www.synergyonline.com/randy
E N D
Spicing Up Web Parts Randy Williams SharePoint Hawaii User Group May 11, 2011
About the Speaker • US-West Coast Manager for Synergy • Based in San Diego, California • Consultant/Trainer/Author • SharePoint MVP • Specialty in architecting solutions • Blog: www.synergyonline.com/randy • Twitter: @tweetraw
Agenda • AJAX • Custom Web Services • Client Object Model • jQuery
How AJAX Works • AJAX consists of JavaScript, DHTML and XMLHTTP • XMLHTTPRequest object • Acts as a web service client • Used instead of a full postback • Web server processes request and sends back response to browser • Browser receives the response and updates the page dynamically
Using AJAX in SP2010 • No configuration changes needed • Built into web.config • Built into v4.master • Two primary ways • Using UpdatePanel control (basic) • Calling web services (advanced)
UpdatePanel • Part of ASP.NET 3.5 • Easiest way to add AJAX capability • Most server-side events run as partial postbacks • For SharePoint, use conditional mode up.UpdateMode= UpdatePanelUpdateMode.Conditional; • Simple, but limited
Demo Using Update Panel
Calling Web Services • Using AJAX, the browser can directly call into Web Services • More powerful than UpdatePanel • JSON is used to encode messages • AJAX engine does most of the hard work • Depending on the method used, OOB Web Services will not work • Custom ones can be used
Creating Custom Web Services • Create new WCF Service App project • Write web service • Configure a web.config for web service • Dynamic bindings will not work with AJAX • enableWebScript endpoint behavior – allows it to be called from AJAX client • Deploy within 14\ISAPI
Demo Using AJAX to Call Custom Web Service
Client Object Model • Working with SharePoint from client applications • ECMAScript (JavaScript) • Silverlight • .NET Managed • Easier than calling web services directly • Provides a subset of the functionality available in the server object model • Designed to work with data within a site collection
The ClientContext Object • ClientContext is your handle to all other objects • Site, Web, List, Item, File • Optimizes communication to server by batching requests • Typical usage: • Define a query to retrieve or modify SharePoint objects • Pass the query to one of the ClientContext’s Load methods • Use ClientContext to execute the query • Work with results returned
Demo Client OM from Silverlight Web Part
Using jQuery • Multi-purpose JavaScript library • With it, you will write less JavaScript • Cross-browser support • Create interactive and usable apps • No need to deploy assemblies • Works great in sandboxed web parts • Hundreds of jQuery plugins
Where to Store these .js Libraries? • Deploy as a module-type feature • Works in both farm and sandboxed WSP • Copy manually to designed libraries • e.g. SiteAssets • Shared or individual instances? • Best to not rename file • e.g. keep as jquery-1.5.1.js
Demo Using jQuery
Using SPServices • Two primary functions • Allows jQuery to easily call SharePoint OOB web services • ListFormWebPart enhancements • Download from http://spservices.codeplex.com/ • Use when Client OM is insufficient
Demo Using jQuery and SPServices