260 likes | 400 Views
PC32. ASP.NET AJAX Futures. Bertrand Le Roy Senior Program Manager Lead Microsoft Corporation. Objectives And Takeaways. Session Objectives Understand what AJAX is Show how Microsoft AJAX is being used today Understand the “pure” AJAX model
E N D
PC32 ASP.NET AJAX Futures Bertrand Le Roy Senior Program Manager Lead Microsoft Corporation
Objectives And Takeaways • Session Objectives • Understand what AJAX is • Show how Microsoft AJAX is being used today • Understand the “pure” AJAX model • Introduce the new AJAX features in ASP.NET 4.0 (client data, client templates, declarative markup, bindings, command bubbling, etc.) • Key Takeaways • ASP.NET AJAX development is more active than ever • Client data-driven UI is easier than ever
What Is AJAX All About?Server AJAX versus "pure" AJAX Server AJAX Rendering Rendering Initial request: HTML Form POST HTML “Pure” AJAX HTML + JSON JSON JSON
Microsoft AJAX TodayA server-side focus • UpdatePanel • Server Controls and Extenders • Developers shielded from JavaScript • Client-focused development possible but less familiar
demo UpdatePanel Bertrand Le Roy Senior Program Manager Lead ASP.NET
The “Pure AJAX” ModelWhy it matters It's all about the standard browser • No plug-in necessary • Network payload is way smaller(data < HTML, no ViewState round-tripping) • Less round-tripping to the server • More reactive UI
ASP.NET AJAX 4.0A client application model • Client-side applications get a lot easier • Server provides JSON data, not HTML • Client data sources • Client template rendering • Live bindings • Declarative instantiation
Client DataFrom Web services to plain JavaScript data • Plain JavaScript data: Arrays and objects • Any JSON Web service • .asmx • WCF • HttpHandler • JSONResult • etc. • ADO.NET Data Services • DataSource control • Server data gets represented on the client as plain JavaScript objects
Client TemplatesSimple rendering on the client • On the server: • <ItemTemplate> <li><%# Eval("Name") %></li></ItemTemplate> • On the client: • <lu class=“sys-template”> <li>{{ Name }}</li></lu>
Client TemplatesSimple rendering on the client • Our design goals • Performance • Simplicity and readability • Security • XHTML (if you care about that) • Easily embed data into markup: {{ Name }} • Default data context is the current data item • Expression language is JavaScript:{{BirthDate.localeFormat(“dd/MM/yyyy”)}} • Interspersed code and markup • Declarative behavior and events
The Microsoft AJAX LibraryA component model for the browser • Namespaces • Components • Controls and Behaviors • $create(Sys.UI.DataView, {serviceUri: “../AdventureWorksAdo.svc”},{},{}, $get(“productListView”));equivalent to:vardv = new Sys.UI.DataView($get(“productListView”));dv.set_serviceURI(“../AdventureWorksAdo.svc”);dv.initialize();
The Microsoft AJAX LibraryA component model for the browser • Namespaces • Components • Controls and Behaviors • $create shortcut and the equivalent code with new • DataView control renders data using a template • Repeater if data is an array • Details view if data is an object • DataSource component integrates data sources • .asmx • WCF • ADO.NET Data Services • etc.
demo Client Templates Bertrand Le Roy Senior Program Manager Lead ASP.NET
Declarative ComponentsExtending markup semantics • Instantiate controls and behaviors from markup • XHTML-compliant markup • Registration:xmlns:dataview=“javascript:Sys.UI.DataView” • Instantiation:<div sys:attach=“dataview”></div> • Setting properties:dataview:serviceuri=“AdventureWorksAdo.svc” • No JavaScript
demo Declarative Instantiation Bertrand Le Roy Senior Program Manager Lead ASP.NET
Command BubblingA simpler approach to building interactive UI • Similar to the server-side concept<asp:buttoncommandName=“select” … /><button sys:command=“select” … /> • Associates commands with UI elements • Commands bubble up the DOM • Controls handle commands they understand • No JavaScript
demo Command Bubbling Bertrand Le Roy Senior Program Manager Lead ASP.NET
Live BindingsFrom data to UI and back • WPF-like syntax<span>{binding Name}</span><input value=“{binding Name}” … /> • They really are live • Reflect changes live from data • Reflect changes live back to data from user input • Changes get instantly propagated • No round-trip to the server • Convert and ConvertBack functions • No JavaScript
demo Live Bindings Bertrand Le Roy Senior Program Manager Lead ASP.NET
What We’ve LearnedA client data drill-down • Getting data from ADO.NET Data Services • Formatting data into HTML using templates • Declaratively instantiating components • Bubbling commands • Binding UI to data • ASP.NET AJAX development is more active than ever • Client data-driven UI is easier than ever
What Else In ASP.NET AJAX 4.0?…and beyond? • Client data • Sorting, pagination, and filtering • Automatically sending changes to the server • ASPX server integration • More controls in the AJAX Control Toolkit • Search engine optimization • jQuery • Splitting the framework into smaller pieces
Learning MoreLinks • Download the latest ASP.NET Previewshttp://www.codeplex.com/aspnet • ASP.NET official Web sitehttp://www.asp.net • Ajax Control Toolkithttp://www.codeplex.com/ajaxcontroltoolkit • Blogshttp://weblogs.asp.net/bleroyhttp://blogs.msdn.com/scottguhttp://www.hanselman.com/bloghttp://weblogs.asp.net/infinitiesloop • October 2008 MSDN Articlehttp://msdn.microsoft.com/en-us/magazine/cc972638.aspx
Evals & Recordings Please fill out your evaluation for this session at: This session will be available as a recording at: www.microsoftpdc.com
Q&A Please use the microphones provided
© 2008 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.