Who’s to blame?
Jeppe Rørbæk
[email protected]+45 51 57 81 67http://blogs.msdn.com/jepper
Developer Evangelist, Development & Platform StrategyMCP, MCAD, MCSD, MCT
What’s on the menu?
AJAX – En smudsig historie?
ASP.NET AJAX – Rengøring med de fede handsker
ASP.NET AJAX – Rengøring AS
ASP.NET AJAX Control Toolkit – Gør det selv, og gør det rigtigt
AJAX – Historie
2005?
AJAX - Asynchronous JavaScript and XML
Jesse James Garret – 18. februar 2005 - definition“Standards-based presentation using XHTML and CSS” “Dynamic display and interaction using the Document Object Model”“Data interchange and manipulation using XML and XSLT” “Asynchronous data retrieval using XMLHttpRequest” “And JavaScript binding everything together”
Også omtalt som ”Enabler of Web 2.0”.
I må komme herop bagefter, hvis det var en af de andre i var ude efter.
AJAX - Asynchronous JavaScript and XML
AJAX - Asynchronous JavaScript and XML
AJAX – De overordnede mål?
Partiel renderingApplikationsdele på klienten (JavaScript)
Demo (Nikhilk)
“AJAX” – Er blevet benyttet længe
TeknologierIFrame’sCallbacks med ASP.NET 2.0XmlHttp (IE 5.5)
Demo (old cr..)
ProblematikkerTypisk opgave
Partiel renderingMulighed for opdatering af en mindre del af en side(det lyder jo egentlig enkelt ... ?)
Typiske problemer - A(argh)JAXBrowserforskellighederBrowserindstillinger
JavaScript / ActiveX2 programmeringsmodeller (og sprog)Integration med server applikation
Tilgang til kontroltræetTid!
Demo
Hvad er behovet?Udvikling af ”ajaxificerede” sider skal være nemt og fleksibelt
”Drag/drop løsninger”.
Problemer med browserforskelligheder skal minimeres.
Kompleksitet omkring XmlHttp skal fjernes.
Man skal kunne gøre som man plejer.
Man skal kunne udvikle avancerede (rige) applikationer på klientsiden på en fornuftig måde, og inden for rimelig tid.
Skal være baseret på eksisterende standarder, og ikke kræve installation hos klienten.
Hensigten med ASP.NET AJAXHøjproduktivt platform for udvikling af AJAX-style browser applikationer.
Færdige komponenter til løsning af typiske opgaverGør AJAX tilgængeligt for alle (Drag/Drop AJAX)(Hvilket jo så også i mere eller mindre grad er tilfældet for andre AJAX baserede frameworks/komponenter)
Uproblematisk integration med den eksisterende .NET platformFuldt integreret med ASP.NETEnkel model for brug af services(Ikke nødvendigvis tilfældet med med andre frameworks/komponenter)
Fuld understøttelse i værktøjerI første omgang bliver jo nok vores egne ;o)
Kompatibilitet og tilgængelighedSkal fungere i ”alle” browsereIngen installation hos klienten
Arkitektur – hvad er budet så (beskrivelse)
Server FrameworkClient Framework
ASP.NET 2.0 Ajax Extensions
Ajax-Enabled Server
Controls
App Services Bridge
Web Services Bridge
Microsoft Ajax Library
Control Layer
Script Core
Base Class Library
UI Layer
Browser Compatibility
ASP.NET 2.0
Application Services
Page Framework,
Server Controls
ASP.NET Pages Web ServicesHTML markup,
CSS, andScript
AJAXServiceProxies
Networking Layer
Microsoft AJAX Library (Client side)Browser Compatibility Layer
Abstraherer forskellighederne i diverse browsereCore Services
Javascript extensions (OO features)Datatyper og serialisering
ASP.NET AJAX Base Class Library”.NET faciliteter” (StringBuilder, Debug, Event, IDisposable)Profile og AuthenticationUdvidet fejlhåndtering
NetværkslagKommunikation med webservicesAbstraktion over XmlHttp
UI LayerParsing af XML ScriptsBindingsBehaviorsUI Components
Control LayerListView, MapControl, Timer, Counter etc...
ASP.NET 2.0 AJAX Extensions (Server side)
Server kontrollerUpdatePanel mv.
WebServicesProfileWebServiceAuthenticationWebService
HttpHandlersScriptHandlerFactoryMultiRequestHandler (batchcalls)GlobalizationHandler
HttpModulesScriptModuleBridgeModuleWebResourceCompressionModule
Hvad giver det så?Browserkompetabilitet
Clientside compatibilitylayer
Kompleksitet omkring asynkrone request med XmlHttpIndpakket i networklayer
Forskellige programmeringsmodellerOO features til JavaScript
BrowserindstillingerVisse ting fungerer både med og uden JavaScript!
Kortere udviklingstidNem udvikling med indbyggede kontroller
Adgang til eksisterende Application Services fra klientenProfile og Authentication services
Server og klientudvikling er bragt tættere på hinandenOO Features i JavaScriptUdvidede muligheder for udvikling af applikationer på klienten
Partiel rendering med UpdatePanels
DemoPage lifecycleRendering
Hvor ”partielt” er det egentlig?
Brug af services
Hvad skal der til?
Hvad foregår der?
Demo
Lille opsummering
Flere måder at arbejde med partiel renderingUpdatePanel’sWebServicesPageMethods !
Men... Er det ikke stadig noget fniller?
JavaScript på WebForms?
ExtendersTilføj behaviors til eksisterende UI komponenter
Demo (DragOverlayExtender, AutoCompleteExtender)
ASP.NET AJAX Control Toolkit
En ordentlig ...fuld af fede extenders
Nogle få selvstændige kontroller
Gode værktøjer for udvikling af egne AJAX kontroller og extenders
Bunker af sourcekode
Visual Studio Templates
TestHarness
Application Services
Indbygget mulighed for at udnytte ASP.NET 2.0 Application Services alá AJAX
Eksempel : DragOverLayExtender / ProfileService
ASP.NET AJAX Control Toolkit
ASP.NET AJAX Control Toolkit
Demo
Udvikling af egne extenders
Benyt de medfølgende Visual Studio Templates
Inspicér eksisterende extenders og ”lad dig inspirere”
Skriv den færdig
Brug den
Eksempel (ImageCropper)
ASP.NET Typiske arbejdstyper
Opdatering af almindelige deklarativt opbyggede siderUpdatePanelsClientside adgang til services
Opdatering af komponentbaserede siderUserControlsCustomControls (JokeBrowser)
Konstruktion af ny AJAX UXControl Toolkit (CityLookUpExtender, ImagePartExt)TemplateUxService?
Hvordan kommer man igang - 1
http://ajax.asp.net
ProduktmodenhedRelease version 1.0
PakkerASP.NET AJAX Extensions
ASP.NET AJAX Control ToolkitASP.NET AJAX Futures CTP
Microsoft AJAX Library
Docs, eksempler og videoer++
Hvordan kommer man igang - 2
Hvordan kommer man igang - 3
Links
http://ajax.asp.nethttp://www.nikhilk.nethttp://projects.nikhilk.net/http://weblogs.asp.net/bleroyhttp://weblogs.asp.net/scottguhttp://www.telerik.comhttp://www.daniel-zeiss.de/AJAXComparison/Results.htmhttp://aspnetresources.com/blog/ms_ajax_cheat_sheets_batch2.aspxhttp://blogs.msdn.com/delay/archive/2007/02/08/toolkit-talk-take-two-spoke-at-the-techready4-conference.aspx
De viste eksempler lægges til download på http://blogs.msdn.com/jepper
Kontakt
Jeppe Rørbæk
[email protected]+45 51 57 81 67http://blogs.msdn.com/jepper
For yderligere spørgsmål, kodeeksempler og/eller lignende