Showing posts with label jQuery. Show all posts
Showing posts with label jQuery. Show all posts

Sunday, 3 October 2010

My SP2010, AJAX and jQuery code samples and slide deck

Had fun speaking at the first UK SharePoint Saturday event yesterday - around 400 attendees, great speakers/topics and great organisation. It felt like quite a lot had gone into my talk, so it was great that I had a full room with people standing round the edges and got great feedback (including on Twitter) afterwards. I’d written a lot of code samples on jQuery, the SharePoint Client OM (JavaScript version) and AJAX requests for the talk – over the next few articles I’ll publish these in some detail, but if you’re keen they can be downloaded along with my deck now from http://db.tt/rUq5lm9

I wanted to tackle this topic as I think it’s important that I (and probably you, if you’re a SharePoint developer) transition my skills to be able to build AJAX apps. Obviously different people are at different stages with this, but in my experience it’s certainly not the default approach yet. If you want some evidence on why it’s important, an interesting exercise is to compare the user experience when you re-order items on these two out-of-the-box SharePoint pages:

  • Manage User Properties (within the User Profile Service Application) - [CentralAdminHost]/_admin/ServiceApplications.aspx (terrible UI, I spent 4 hours reordering some properties on this page once!)
  • Manage Navigation (on a publishing site) – [PublishingSiteUrl]/_layouts/AreaNavigationSettings.aspx (much better UI, no postbacks)

A core theme of my talk was that whilst building AJAX-style apps on SharePoint 2010 seems complex, it can be distilled down to 3 core techniques. The full agenda of my talk was:

  • 3 core techniques for building AJAX-style apps on SharePoint 2010
    • Using jQuery to manipulate the page – although jQuery is a large topic, my view is that there are only about 7 key methods/events which give you most of what you need
    • Using the JavaScript Client OM to query lists/add list items – again, whilst the Client OM can do many things, once you understand the pattern for working with lists everything else is similar
    • Using jQuery’s 3 AJAX methods with a HTTP handler – for me this approach is simpler than WCF, and is a key technique which unlocks the door to AJAX apps since you can write whatever server-side code you require and call it asynchronously
  • Tips and tricks
    • How to get Intellisense with jQuery and the Client OM
    • How to debug JavaScript
    • Using FireFinder to hone your jQuery selectors
    • How to easily return JSON-formatted data from a handler and work with it on the client
  • Migrating an existing SharePoint app from postbacks to jQuery/AJAX
    • Here I demo’d the steps I used to migrate the application page in my SP2010 Feature Upgrade Kit to jQuery/AJAX (courtesy of code snippets)

Since you never fully grok new learnings from a 1 hour presentation, a couple of attendees asked if I’d expand on the contents in my blog, and that’s exactly what I want to do. So my next blog series will cover this ground in close detail. As I mentioned in my talk, I don’t consider myself a guru in this area so comments/suggestions especially welcome!

That link again to my code samples/deck is http://db.tt/rUq5lm9