Technologia AJAX oraz j Query ASP NET MVC

  • Slides: 17
Download presentation
Technologia AJAX oraz j. Query ASP. NET MVC 3 Andrzej Bejgier Piotr Warzocha

Technologia AJAX oraz j. Query ASP. NET MVC 3 Andrzej Bejgier Piotr Warzocha

Plan prezentacji 1) 2) 3) 4) Technologia AJAX – podstawy Ajax – przykładowe programy

Plan prezentacji 1) 2) 3) 4) Technologia AJAX – podstawy Ajax – przykładowe programy j. Query Ajax/j. Query – przykładowe programy

Technologia AJAX – podstawy AJAX - Asynchronous Java. Script and XML AJAX – jest

Technologia AJAX – podstawy AJAX - Asynchronous Java. Script and XML AJAX – jest metodą używającą skryptów klienta w celu wymiany danych bez konieczności odświeżania całej strony

Technologia AJAX – podstawy Komponenty AJAX: - Java. Script Document Object Model (DOM) Kaskadowe

Technologia AJAX – podstawy Komponenty AJAX: - Java. Script Document Object Model (DOM) Kaskadowe arkusze stylu CSS XMLHttp. Request

Technologia AJAX - podstawy Rys. 1 Aplikacja działająca tradycyjnie według schematu synchronicznego

Technologia AJAX - podstawy Rys. 1 Aplikacja działająca tradycyjnie według schematu synchronicznego

Technologia AJAX – podstawy Rys. 2 Aplikacja działająca według schematu asynchronicznego

Technologia AJAX – podstawy Rys. 2 Aplikacja działająca według schematu asynchronicznego

Przykłady

Przykłady

AJAX – przykładowe programy

AJAX – przykładowe programy

AJAX – przykładowe programy Atrybuty klasy Ajax. Options: - Confirm - Http. Method -

AJAX – przykładowe programy Atrybuty klasy Ajax. Options: - Confirm - Http. Method - Insertion. Mode (Insert. After, Insert. Before, Replace) - Loading. Element. Id - On. Begin - On. Complete - On. Failure - On. Success - Update. Target. Id - Url

AJAX – przykładowe programy Przykłady użycia atrybutów: - Confirm Insertion. Mode (Insert. After, Insert.

AJAX – przykładowe programy Przykłady użycia atrybutów: - Confirm Insertion. Mode (Insert. After, Insert. Before, Replace) Loading. Element. Id On. Complete On. Success

AJAX – przykładowe programy Przykład 2: - Obiekt Parial. View – fragment widoku wielokrotnego

AJAX – przykładowe programy Przykład 2: - Obiekt Parial. View – fragment widoku wielokrotnego użycia – komponent użytkownika - Metoda Html. Render. Partial(nazwa. Komponentu) umieszczenie komponentu w widoku - Metoda Is. Ajax. Request obiektu Request – czy witryna wymaga częściowego odświeżania

j. Query – framework napisany w Java. Script Cel: ułatwienie obsługi drzewa DOM i

j. Query – framework napisany w Java. Script Cel: ułatwienie obsługi drzewa DOM i ukrycie różnic w interpretacji kodu przez przeglądarki (obiekt XMLHttp. Request). Przedstawienie asynchronicznego przetwarzania żądań HTTP w oparciu o j. Query.

Ajax/j. Query – przykładowe programy Metoda load(): - Postać: load(’adres. html’, ’par=w 1&par=w 2&…’,

Ajax/j. Query – przykładowe programy Metoda load(): - Postać: load(’adres. html’, ’par=w 1&par=w 2&…’, function(html) {} ); - Wywołanie: $(‘#id’). load(’cos. html’)

Ajax/j. Query – przykładowe programy Procedura. ajax({tablica}), wybrane elementy tablicy: - type (POST, GET)

Ajax/j. Query – przykładowe programy Procedura. ajax({tablica}), wybrane elementy tablicy: - type (POST, GET) - data - url - data. Type - success - timeout - cache - before. Send - error

Ajax/j. Query – przykładowe programy Przykład 1: - Metoda submit formularza - Procedura. ajax

Ajax/j. Query – przykładowe programy Przykład 1: - Metoda submit formularza - Procedura. ajax (analog Ajax. Begin. Form)

Ajax/j. Query – przykładowe programy Przykład 2: - Metoda autocomplete z j. Query skojarzona

Ajax/j. Query – przykładowe programy Przykład 2: - Metoda autocomplete z j. Query skojarzona z polem tekstowym (dwa warianty użycia) - Procedura. ajax (analog Ajax. Begin. Form) - Format json (Java. Script Object Notation)

Źródła ASP. NET AJAX w działaniu, Alessandro Gallo, David Barkol, Rama Krishna Vavilala, PWN

Źródła ASP. NET AJAX w działaniu, Alessandro Gallo, David Barkol, Rama Krishna Vavilala, PWN 2009 Materiały od dra Matulewskiego http: //weblogs. asp. net/scottgu/archive/2010/07/02/introd ucing-razor. aspx http: //msdn. microsoft. com/en-us/gg 465291 http: //www. asp. net/mvc http: //jquery. com/