Spicing Up Web Parts using AJAX and Client Object Model<br />Randy Williams<br />Synergy<br />rwilliams@synergyonline.com<...
About the Speaker<br />US-West Coast Manager for Synergy<br />Based in San Diego, California<br />Consultant/Trainer/Autho...
Agenda<br />AJAX<br />Custom Web Services<br />Client Object Model<br />jQuery<br />
How AJAX Works<br />AJAX consists of JavaScript, DHTML and XMLHTTP<br />XMLHTTPRequest object<br />Acts as a web service c...
Using AJAX in SP2010<br />No configuration changes needed<br />Built into web.config<br />Built into v4.master<br />Two pr...
UpdatePanel<br />Part of ASP.NET 3.5<br />Easiest way to add AJAX capability<br />Most server-side events run as partial p...
Demo<br />Using Update Panel<br />
Calling Web Services<br />Using AJAX, the browser can directly call into Web Services<br />More powerful than UpdatePanel<...
Creating Custom Web Services<br />Create new WCF Service App project<br />Write web service<br />Configure a web.config fo...
Demo<br />Using AJAX to Call Custom Web Service<br />
Client Object Model<br />Working with SharePoint from client applications<br />ECMAScript (JavaScript)<br />Silverlight<br...
The ClientContext Object<br />ClientContext is your handle to all other objects<br />Site, Web, List, Item, File<br />Opti...
Demo<br />Client OM from Silverlight Web Part<br />
Session Heads-Up<br />In Raphael 1, tomorrow at 1:45pm…<br />	Randy Williams<br />	SharePoint 2010: Developing with<br />	...
Using jQuery<br />Multi-purpose JavaScript library<br />With it, you will write less JavaScript <br />Cross-browser suppo...
Where to Store these .js Libraries?<br />Deploy as a module-type feature<br />Works in both farm and sandboxed WSP<br />Co...
Demo<br />Using jQuery<br />
Using SPServices<br />Two primary functions<br />Allows jQuery to easily call SharePoint OOB web services<br />ListFormWeb...
Demo<br />Using jQuery and SPServices<br />
Your Feedback is Important<br />Please fill out a session evaluation form.<br />Thank you!<br />
Upcoming SlideShare
Loading in...5
×

Spicing up SharePoint web parts

1,936

Published on

From DevConnections Las Vegas, Apr 19, 2011

Whether it’s dashboards, content publishing, or day-to-day collaboration, SharePoint’s web pages usually contain lots of web parts. Using traditional post-back techniques to refresh a single web part’s content is both slow and visually annoying. This session will cover what’s possible using AJAX, custom web services, the client object model and jQuery to spice up the SharePoint web parts that you’re cooking. Boom!

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,936
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Spicing up SharePoint web parts"

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

×