Upload
peterbrunone
View
11
Download
7
Tags:
Embed Size (px)
DESCRIPTION
First delivered at SharePoint Saturday Houston, this presentation provides a brief background of the use of JavaScript in SharePoint before forging ahead into the capabilities of jQuery and the Client-Side Object Model.
Citation preview
Welcome
2
Welcome to SharePoint Saturday Houston
• Please turn off all electronic devices or set them to vibrate.• If you must take a phone call, please do so in the hall so as not
to disturb others.• Thanks to our Title Sponsor: And our Platinum Sponsors:
Thank you for being a part of the 3rd Annual SharePoint Saturday for the greater
Houston area!
3
Information• Speaker presentation slides will be available at
SharePointSaturday.org/Houston within a week• Keep checking website for future events• The Houston SharePoint User Group at
www.h-spug.org, will be having it’s May meeting Wednesday May 24th. Please be sure to join us!
• Have a great day!
DON’T FORGET…to drop a business card up front!
Prize drawing after the show.
IntroductionsPeter Brunone (that’s me)
• [email protected]• http://weblogs.asp.net/PeterBrunone
In my life, I have:• Ridden a unicycle• Learned to play the tuba• Become an avid fan of both Doctor Who and Doctor McNinja• Not yet gotten on Twitter joined Twitter during this presentation
Power to the PeopleManipulating SharePoint with client-side JavaScript
Peter Brunone, [email protected]
http://weblogs.asp.net/peterbrunone
SERIOUSLY
Don’t forget to put your card in for the drawing.
You’ll wish you had.
Two sides to every (dev) story
Traditionally, this is how it’s been:
Client-Side Manipulation
• Style changes (though clunky)
• UI goodness (also clunky)• You can push a lot of
buttons…
Server-Side Manipulation
• List item CRUD• Security/Permissions• TRUE POWER!• (but mostly reserved for
Visual Studio)
So why develop client-side?
A few reasons:
• No special permissions required• No required packaging• No solution deployment process
= Quicker changes!
Let’s talk about…
• The role of JavaScript from then to now
• The rise of jQuery
• Tool memos and cool demos
JavaScript in SharePoint(a brief history)
In the beginning, there was… not much.
• SP 1 – wait, there was a SharePoint v1?• WSS 2.0 (SharePoint 2003) – FrontPage
– Web Services!• WSS 3.0 (MOSS 2007) – SP Designer
– Web Services – a few more options– Hack the Content Editor WebPart (CEWP)
JavaScript in SharePoint
Web Services
– (insert mammoth block of code here)
JavaScript in SharePoint
…and then along came jQuery!
– http://jquery.com
– A JavaScript library that abstracts out a ton of basic (and not-so-basic) functions
– Largely affects the markup in the browser
– …BUT has some great built-in AJAX help for calling server resources
JavaScript in SharePoint
Demonstration: Styling, etc. with jQuery
$(document).ready(function() { var soapEnvelope = "<soapenv:Envelope xmlns:soapenv='http://schemas.xmlsoap.org/soap/envelope/'> \ <soapenv:Body> \ <GetListCollection xmlns='http://schemas.microsoft.com/sharepoint/soap/'> \ </GetListCollection> \ </soapenv:Body> \ </soapenv:Envelope>"; $.ajax({ url: "http://yoursite/_vti_bin/lists.asmx", type: "POST", dataType: "xml", data: soapEnv, complete: getListNames, contentType: "text/xml; charset=\"utf-8\"" });});
function getListNames(xData, status) { $(xData.responseXML).find("List").each(function() { $("#data").append("<div>" + $(this).attr("Title") + "</div>"); });}
A lot less code, but still a bit of XML to track. (Do I want to have to know what a “SOAP Envelope” is?)
(Special thanks to Jan Tielens for the code sample)
Web Services and jQuery
The SPServices JavaScript library
• http://spservices.codeplex.com/• Thank you, Marc Anderson (@sympmarc)!• Packaged web service operations for SP• Runs on top of jQuery
A still more excellent way
What’s new in 2010?
All hail the Client-Side Object Model!
• Managed code (VB, C#, anything that compiles for the .NET CLR)
• Silverlight
• JavaScript (ECMAScript)
Managed Code
Pros:• Very powerful.• Easy point of entry for .NET developers
Cons:• Need .NET framework (proper version) on all
target machines• Oh, and Visual Studio. You must compile.
Silverlight
Pros:• It’s cool.• Broader target base -- no .NET install required
Cons:• Still not completely accepted• Users must install a plug-in• Another dev platform to learn (school is boring)
JavaScript
Pros:• Almost universally accepted – mature tech• Platform independent (OOTB browser support)
Cons:• Not all SP CSOM functionality is available• Object types differ (JS is a loosely-typed language)
– Some obscure methods replace
Using JS with the CSOM
All objects are derived from the SharePoint Object Model
What you need:
• SP.js
• The SharePoint default master page (trust me)
• FormDigest element – it’s for your own safety, ma’am.
Using JS with the CSOM
Demonstration: Adding and retrieving list items
The sum of our training
Nothing to see here
(last demo)
Questions?
Power to the PeopleManipulating SharePoint with client-side JavaScript
Peter Brunone, [email protected]
http://weblogs.asp.net/peterbrunone
28
Thanks to all our Sponsors