Date post: | 20-Dec-2015 |
Category: |
Documents |
View: | 215 times |
Download: | 1 times |
Jax Code Camp 2010
Good morning
iPhone Dev
•How to develop for the iOS 4
jQuery 1.4 and ASP.NETJax Code Camp 2010
About Me
•David Fekke
•Software Engineer
•Lender Processing Services
•Fekke L.L.C.
•iPhone, iPad and Android Apps
•ASP.NET and ColdFusion
Douglas Crockford “Good architecture is necessary to give programs enough structure to be able to grow large without collapsing into a puddle of confusion.”
John Resig“The DOM is a mess!”
jQuery
•Javascript Framework
•2006
•Included with Visual Studio
•20% of all websites
•31% of top 10,000 websites
Licensing
•FREE
•MIT License
•Included with Visual Studio
•Tell the lawyers to relax
jQuery features
•Do a lot with very little code
•Chain multiple commands together
•AJAX Library
•UI Library
Sample jQuery
$(“div.myClass”).fadeOut().addClass(“myNewClass”);
Microsoft Support
•Microsoft on JQuery Board
•Supported since Visual Studio 2008 sp1
•Intellisense support
•Libraries come included in certain projects
Getting Started
•Download from jquery.com
•Can use a CDN such as Google
•Include jQuery library in your html
<script src="scripts/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery();</script>
<script type="text/javascript">
$();</script>
jQuery plays with others
•$ is an Alias of jQuery
•jQuery.noConflict(); will turn off $ alias
•Must be run in document ready()
Page Load
•onload can be used, but not preferred
•$(document).ready() same as onload
•$() will work as a shortcut
Sizzle Selector Library
•Selector Library now its own project
•Core to how jQuery works
•CSS 1-3 selectors for matching elements
Querying in jQuery
•select any DOM element
•$(document); // Document object
•$(p); // all paragraph elements
•$(tr:nth-child(1)); // first row of each table
•$(p > a); // all anchors inside paragraph tags
Trigger Events
•$(a#home).bind(“click”,fn);
•$(a#home).click(fn);
•$(a#home).live(“click”,fn);
Utility functions
•$.trim(someString);
•$.makeArray(obj);
•$.unique(array)
Traversing
•next(expr)
•previous(expr)
•parents(expr)
•siblings(expr)
•children(expr)
Chaining
•$(‘p’).next().css(‘font’,’Times’).append(‘<br/>’);
Use Each with Wrapped Sets
•$(a) returns array
•var single_item = $(a)[0];
•Each(function(){ //do something })
AJAX
•jQuery.getJSON();
•jQuery.ajax();
{"menu": { "id": "file", "value": "File", "popup": { "menuitem": [ {"value": "New", "onclick": "CreateNewDoc()"}, {"value": "Open", "onclick": "OpenDoc()"}, {"value": "Close", "onclick": "CloseDoc()"} ] }}}
jQuery and .NET•Use REST over SOAP
•Try to use JSON over XML if possible
•WCF can output JSON
•var svc = new Sys.Data.DataService("j.svc")
•ASP.NET MVC can handle JSON actions
Plugins
•jQuery is extensible
•Write your own
•jQuery.fn.mypluginname = fn()
•Huge Ecosystem of Plugins
New to 1.4
•$().live(“eventType”, fn);
•$().closest(“eventType”, fn);
•$().proxy(fn, context);
Demo
Resources
•jQuery.com
•http://jqueryui.com
•http://jquery14.com
•http://www.manning.com/bibeault/
?Questions
?
How to Contact me
•davidfekke @ gmail dot com
•twitter @davidfekke
•Blog at http://www.fekke.com/blog/