Tuesday, August 31, 2010

WEB302 Bringing the Web to Life with jQuery

Speaker: Jeremy Boyd

Visual Studio Intellisense support.
Works well with MVC and the existing MS Ajax libraries

Helps avoid cross browser issues.

Microsoft and Google CDN versions

Requires good HTML structure for selectors.

doc.jquery.com

xval for doing validation between client and server.

1. Expanders
- Expanding and collapsing divs.
$("selector").hide();
$("selector").fadeIn();
$("selector").slideToggle();

Select sets using CSS3 selectors.

2. Buttons
- $("#go").click(function() { $("form").submit(); return false; } );

3. Highlighting Errored Form Elements
- .css('prop'. 'val');
.addClass('foo');

$(":input").removeClass("errored");

4. Consuming server side JSON data
Autocomplete textbox.
$.post(url, payload, callback);
$.ajax({ type: 'POST', ...});

FlexBox

JsonResult

5. jQueryui
http://jqueryui.com
UI library of widgets, animation

.accordion()

6. 3rd Party Plugins

7. LightBox
FancyBox

Easing - function over time for animation.

8. Writing your own plugins
- plugin authoring

.html()
.live() - for anything that matches the selector now or in the future apply this selector.

9. Copying a cool technique you have seen