Cool Use of SPServices from SPEvilGenius (aka Daniel Walker)

Every once in a while, someone comes back to the jQuery Library for SharePoint Web Services (SPServices) site and shares something they have been doing with the library.  I read through one today that was impressive, so I thought I’d post it here so more people can read it and see what neato stuff is possible.

This one is from spevilgenius, aka Daniel Walker (@spevilgenius):

Okay, so I have used the library in conjunction with the jQuery UI library to create a multi item edit form of sorts. Basically, the customer wanted to have a form similar to access where you can just page though different forms and edit them accordingly. I really did not want to re-invent the wheel per se as I already had an edit form that worked well. So what I did was add an item to the Edit Control Block in javascript that is called ‘Edit Series’. This just calls a function that is based on the id of that item. In this case the customer wanted to have the multi item forms based on a common serial number. So the function calls an SPServices function that is set to return the serial number of that item and it automatically takes the user to the page with that form on it. This page uses javascript to get the requested serial number and then does two loops using SPServices. I decided that I wanted to use the tabs widget of the jQuery UI to hold the ‘forms’ in. So the first loop builds the ul and li tags for the tabs and the second loop builds the div tags for each tab. Inside each div is an iframe that loads the editform for the item based on its id which is passed in with the SPServices function. The result is a page that has tabs for each of the items with the same serial number all set in edit mode. Does anyone else think that is cool or just me :) ??

No, it’s not just you! This is way cool stuff, and the reason I wanted to write this library in the first place.  It lets you break out of the traditional postback model and create pages like this that are truly interactive.