Embed Size (px)
DESCRIPTION
This is mainly a tips-and-workarounds kind of a session. In which we go through different approaches in using jQuery in ASP.NET 3.5 and 4.0 applications to achieve common functionality with much better performance and UI richness without paying so many additional development hours to deliver this. Also shows how ASP.NET AJAX Library Beta can work for even further power, as well as how far tool support can give us in real world applications. In brief, we show how to use the right tool for the right job!
Citation preview
Using jQuery To Survive In ASP.NET Webforms World
Mohamed Meligy
http://GuruStop.NET
Who am I?
• 2005: Blogging, http://geekswithblogs.net/Mohamed, http://weblogs.asp.net/meligy, http://GuruStop.NET
• 2006: SilverKey Demo Day 1• 2007: SilverKey Demo Day 2• 2007: Several dotNETwork Gatherings• 2008: ITWorx Cutting Edge Club• 2008: Several dotNETwork Gatherings• 2009: doeNETwork Code Camp`09• Worked in SilverKey, Raya Experts Team• Currently Working in Abu Dhabi• 2010: doeNETwork Code Camp`10
Topics
• Quick Introduction to jQuery• Demo• VS 2008 Intellisense• VS 2010 Integration• Demo• Working with ASP.NET Controls• Demo• Working with ASP.NET AJAX• Demo• Working with ASP.NET AJAX Library Beta• Demo
What Is jQuery?
$("#myID").css("opacity",0.20);
$(".myClass1,.myclass2").hide();
$("table>tbody>tr:even")
.addClass("gridAlternate")
.css( {font-weight:"bold",padding:"3px"} );
$("#gdEntries tr").click(function(e){
alert( $(e.target).text() );
});
$("<div>").attr("id","divNew")
.appendTo(document.body);
Introducing jQuery
http://docs.jQuery.com/Selectors
jQuery Wrapped Object
• $().html().text().val().attr().append().empty()• $().css().addClass().removeClass().hasClass()
.offset().height().width()
.scrollTop().scrollLeft().show().hide()• $().find().is().has().not().filter()
.parent().closest().next()• $().live().bind().click().dblclick().hover().toggle()
.blur().keydown().keyup()
.resize().mouseover().mousedown()
Visual Studio Intellisense
Visual Studio 2008
• Requires– Manual jQuery files– VS 2008 Service Pack 1– Special hot-fix file
Visual Studio 2010
• Default solution structure• jQuery 1.3.2
– You still need to replace for jQuery 1.4
Download MIN and VSDOC
Reference MIN
Reference & Hide VSDOC
jQuery Functionality
• Fucntions• $.ajax• $.post,• $.getJson
• UI Library• Tabs• Modal Dialogs• Date Picker• Slider• So much more…
• Plug-in Framework• All kinds of modal pop-ups• Validations• Image Slideshows• So much more …
• U Library Effects• Fade in-out• Blink• So much more…
DEMO
Hosted Locally or on CDN
• Google and Microsoft host it for you on their Content Delivery Networks.
• Benefits– Cache– Bandwidth– Paralelism
• Can fallback to local source if not available.
Where to go…• http://jquery.org
– http://jquery.com
• http://asp.net/ajaxlibrary– http://asp.net/ajaxlibrary/CDN.ashx
• http://weblogs.asp.net/aspnet-team– http://blogs.msdn.com/webdevtools– http://tinyurl.com/vsdoc
• Invest– http://tekpub.com– http://tinyurl.com/51-jquery-aspnet
• Individual Blogs– http://encosia.com– http://mattberseth.com– http://GuruStop.NET
