jQuery vs AJAX Control Toolkit

jQuery vs AJAX Control Toolkit

• 1.
  1An Introduction andComparison between jQuery and the AJAX Control ToolkitT Josephson & E RalstonBIS BoFAugust 24th, 2009
• 2.
  2
• 3.
  3Ajax Control ToolkitLibraryof CSS-driven, Ajax-enabled server-side controls and extenders
• 4.
  use likeconventional ASP.NET controls
• 5.
  encapsulate client-sideCSS and JavaScript
• 6.
  Ajax-aware asappropriate
• 7.
  Developed using acollaborative source model
• 8.
  source freelyavailable with modification license
• 9.
  contributions welcomefrom all developers
• 10.
  37 controlsin current release4Controls vs. Extenders*Controls* are new UI elements *Extenders* extend existing UI elements Example:Tabs, ComboBox, HTMLEditor, NoBot, Rating, ReorderList are the controlsAutoComplete and Calendar are TextBox extendersBoth offer client-side functionality with sophisticated JavaScript renderings
• 11.
  Extenders increase flexibilityof toolkit:
• 12.
  apply toa variety of ASP.NET controls
• 13.
  apply toexisting controls in existing apps4
• 14.
  5Ajax Control ToolkitSummaryToolkit offers client-side controls in a convention ASP.NET model
• 15.
  encapsulates complexJavaScript, CSS and Ajax
• 16.
  Extender model increasesflexibility of toolkit
• 17.
  Toolkit offerssome nice functionality
• 18.
  Requires install ofthe Ajax Control Toolkit to get startedhttp://www.codeplex.com/Wiki/View.aspx?ProjectName=AjaxControlToolkit Interesting development model for Microsoft
• 19.
  contributions welcomefrom all!5
• 20.
  jQueryOpen Source JavaScriptLibraryGoalsLeverage CSS SelectorsSimplify DOM ManipulationLightweightBe extensibleBe functional6
• 21.
  Events & EffectsProvidesprogrammatic event hookupMouse & KeyboardApply various effects Show/Hide, Fade, Slide, and AnimateOther effects available using plug-ins 7
• 22.
  jQuery Plug-insJavaScript Librariesthat depend on jQuery and add functionalityjQuery UI is one pluginOver 1000 more available as plugins.jquery.com“Controls”AnimationLayoutMediaData8
• 23.
  AJAX Control ToolkitDemo9
• 24.
  jQuery Demo10
• 25.
  jQuery & MicrosoftAJAX11jQuery is supported by MicrosoftjQuery will ship with Visual Studio 2010Available for 2008 with a patch
• 26.
  Pitfalls When UsingjQuery & AJAX Control Toolkit TogetherAJAX + jQuery + jQuery Plug-ins = a lot of JavaScript!AJAX Controls have unreliable IDs, use CSS Class or element typeUsing AJAX to update the screen removes jQuery effectsA plain UpdatePanel can also have this effect12
• 27.
  When should Iuse each library?AJAX Control Toolkit when…You are using ASP.net & Visual StudioYou want to callback to the server implicitlyYou want a simple solutionjQuery when…You are really comfortable with JavaScriptMost interaction is client-side onlyYou need a custom solution13
• 28.
  Questions?14