Softwaresponsoren Mediasponsoren. Jan Molnar Jan-Cornelius.Monlnar@studentprogram.de Dennis Zielke...

Sponsoren

Softwaresponsoren

Mediasponsoren

www.dnug-koeln.de www.justcommunity.de

Einführung in die Ajax Library

Jan MolnarJan-Cornelius.Monlnar@studentprogram.deDennis Zielkei-denniz@microsoft.com

Agenda

Ajax Library GrundlagenJavascript Debugging, WebservicesJavascript EventsJavascript AuthentifizierungDatabindingUI Effekte

Mehr als nur Ajax

Cross-Browser Framework Objekt-Orientiertes Javascript.NET Event ModellImperative + Deklarative ProgrammierungControlBindingControl Extensions + BehavioursData BindingSupport für ASP.NET, Java, PHP...

Client

Architektur

Components

Browser Compability

Networking

Core Services

Server

Script Support

Web Services

Application Services

Server Controls

MicrosoftAjax.js

String-Builder

Sys

WebRequest-Executor

Sys.Net

_ProfileService

Sys.Services

JavaScript-Serializer

Sys.Serialization

DOMElement

Sys.UI

_Debug

EventArgs

Component

_Application

XMLHttp-EXecutor

_WebRequest-Manager

WebRequest

WebService-Proxy

WebService-Error

Other

ProfileGroup

_Authentication-Service

DOMEvent

Behavior

Control

Point

Bounds

_Timer

CultureInfo

Other

Javascript Erweiterungen

VererbungInterfaces + Abstrakte KlassenNamespacesEnumerationsDelegatesEventsPartial Rendering EngineReflection

Base Type Extensions

Microsoft AJAX Library erweitert JavaScript

Array - add, addRange, contains, insert, etc.Boolean - parseDate - format, parselocale, parseInvariant, etc.Error - argumentOutOfRange, etc.Number - format, parseLocale, parseInvariantObject - getType, getTypeNameString - format, endsWith, startWith, trim, etc.

$get, $find & $create …

Globale FunktionenVerweise auf statische Klassen

$get -> Sys.UI.DomElement.getElementById$create -> Sys.Component.create$find -> Sys.Application.findComponent$addHandler ->

Sys.UI.DomEvent.addHandler$removeHandler -> System.UI.DomEvent.removeHandler$clearHandlers -> Sys.UI.DomEvent.clearHandlers

Javascript Webservices

JSON statt XMLCa. 30% weniger OverheadNeues [ScriptService] Attribut

Automatische GenerierungWebservices BridgeAlternative: PageMethod

Javascript Webservices

demo

Javascript Debugging

Sys.Debug ObjektDebuggingTracing

MicrosoftAjax.debug.jsLesbare FormatierungKommentare

Debuggint

Debugging unterstützt"assert""fail""trace""traceDump"

Sys.Debug = new Sys._Debug();

Javascript Debugging

demo

Sys.Application

Zuständig für den Client-Page-LifeCycleLäd & initialisiert Komponenten

Client Page LifeCycleWindow

Sys.Application

Component

1. Open Page2. init

3. $create

4. load

5. $get

6. Close Page7. unload

Client-Page-LifeCycle

demo

Ajax Events

function pageLoad() {var element = $get(“elementId“);$addHandler(element, „click“, elementClick);

}

function elementClick(e) {// event handling

}

Ajax DOM

Sys.UI.DomElementaddCssClass / removeCssClasscontainsCssClasstoggleCssClass

getBoundssetLocationsetVisible

Ajax DOM

demo

Ajax Services

Authentication ServiceZugriff auf ASP.NET MembershipProfile ServiceZugriff auf ASP.NET Profil

Ajax Services

demo

Sys.Preview.[UI.].Data

Enthält Databinding fähige KlassenItemView und ListView

Javascript Databinding

demo

Sys.Preview.UI

ComponentTimer, DragDropManager, …

BehaviorFloating, DropZone, Opacity, …

ControlTextBox, Menu, CheckBox, …

Ajax Drag & Drop

demo

Q&A

www.dnug-koeln.de

www.justcommunity.de

Sponsoren

Softwaresponsoren

Mediasponsoren