Intro to jQuery with ColdFusion
Raymond Camden (ray@camdenfamily.com)
http://www.coldfusionjedi.com

JavaScript is NOT the Enemy

You can find peace

Why jQuery?
Powerful
Wide support
It works for me (after an initial period of grumpy old man whining)

History & Tidbits
Created by John Resig in January 2006
Currently version 1.3.2
Site, mailing lists, books, extensions
Used by some very large sites (big people, big people)

History & Tidbits (2)
Compatability: Firefox 2.0, IE 6+, Safari 3+, Opera 9+, Chrome 1+
Free (duh)
Download minified, compressed, or full fat.
Available via Google CDN

So what does it do?
Finds stuff
Changes stuff
Loads stuff
(And more stuff)

Signs you may be working with jQuery...
$ is jQuery
Lots and lots and lots of stuff chained together: $(something).doSomething().doSomethingElse().doSomethingMore().doSomethingAgain().heyWhyNotDoitAgain().areWeThereYet()

Quick Demo

Selectors (Finding stuff)
Follows CSS rules
With a few extras...
$( this is where you do it )

Selector Examples
$("#SOMEID")
$(".SOMECLASS")
$("TAG")

Demo
/ex2/test1.html

Selector Examples (2)
Immediate kids: $("#parent > p")
All kids: $("#parent p")

Demo
/ex2/test2.html

Selector Examples (3)
Not! $("something:not(somethingelse)")
With Something: $("img[alt]")

Demo
/ex2/test3.html

Selectors Gone Wild
Match values at the beginning: ^
Match values at the end: $
Match values anywhere: *

Demo
/ex2/test4.html

Custom Selectors
:even, :odd
:eq (numeric, ie, the Nth one)
:nth-child('even|odd|#')

Demo
/ex/test5.html

Selectors - More...
contains
form related (checked, selected, en/disabled)
next, prev, parent, children, siblings
filter

Demo
/ex2/test6.html

Manipulation
Adding, removing classes
Setting, getting attributes
Prepending, appending
Changing contents

Demo
/ex3/*

Events
What you expect (click, change, etc)
Special ones: hover, toggle
$(document).ready

Demo
/ex4/*

no text exists for this slide

Effects Support
Hiding/Showing
Fading
Slide up/down
List of changes

Demo
http://docs.jquery.com/Effects

Ajax
load
get
post
getJSON
getScript

Demo
/ex5 (hey Ray, don't show test5.html yet)

Plugins
Approx 2,400
Wide range of areas: UI, Forms, Widgets, Etc
Quality also covers a wide range

My Favorites
Validate
http://plugins.jquery.com/project/validate
Thickbox
http://jquery.com/demo/thickbox/
jqGrid
http://www.trirand.com/blog/
jQuery Select
http://www.texotela.co.uk/code/jquery/select/

jQuery+ColdFusion

CF: Helpful Things
Still the Glue
Native JSON support
returnFormat
XML generation (by hand, but still easy)

CF: Not-So Helpful Things
onRequest (EVIL++) (Fixed in ColdFusion 9!)
Whitespace
Debugging

Demo
/ex7 (yes, I skipped /ex6, but pretend you didn't notice)

Where next?
Listserv: http://groups.google.com/group/jquery-en
Books: Many, but I recommend: Learning jQuery 1.3

Any Questions?
My email: ray@camdenfamily.com
My blog: www.coldfusionjedi.com
My other blog: www.insideria.com