1. Введение
2. Обзор framework'а
3. Жизненный цикл страницы
4. Полезные объекты и функции

1. Введение

В предыдущем посте из этой серии (ASP.NET Ajax. Часть 1: что внутри?) я рассказал что такое AJAX и как Microsoft помогает нам его использовать. Сегодня я более подробно расскажу о его клиентской части. Частично из-за того, что эту информацию не так просто найти в MSDN, как хотелось бы, частично  из-за того, что в последнее время Microsoft уделяет этой части всё меньше внимания, агитируя использовать jQuery, многие разработчики даже на догадываются какой мощных инструмент находится у них в руках.

2. Обзор framework'а

По умолчанию, эти скрипты грузятся на страницу, на которой есть ScriptManager по ссылке вида ScriptResource.axd?d=scriptIdentificator. Сами же скрипты находятся в ресурсах сборки System.Web.Extensions (если у кого-то всё-ещё установлена VS2005, то эти скрипты можно найти в папке c:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\MicrosoftAjaxLibrary\System.Web.Extensions\). Также можно загружать эти скрипты с помощью CDN. Подробнее об этом способе можно почитать тут.
Сам скирт немного отличается для WebForms и ASP.NET MVC, но ядро у них общее.
Все функции/объекты разделены на пространства имён (namespaces) по аналогии с серверной частью. Перечислять я их не буду, так как на MSDN (http://msdn.microsoft.com/en-us/library/bb397536.aspx, http://msdn.microsoft.com/en-us/library/dd410060.aspx) всё хорошо описано.

3. Жизненный цикл страницы

Кроме стандартных для DOM модели событий, ASP.NET Ajax предоставляет нам  доступ как к событиям всего приложения (init, load, unload и др.), так и события, связанные с запросами на сервер (beginRequest, endRequest и др.). Как всегда, за полной информацией лучше обратиться в первоисточник, а именно - http://msdn.microsoft.com/en-us/library/bb386417.aspx.

4.Полезные объекты и функции

MS Ajax Library предоставляет нам как новые типы/функции, так и расширения для стандартных - Array, Number, Date, String и др., о которых можно почитать в MSDN Magazine (http://msdn.microsoft.com/en-us/magazine/cc163300.aspx).
Одними из наиболее частоиспользуемых являются функции $get() и $find():
- $get()  - оптимизированный по производительности аналог document.getElementById, который ищет элемент по его ID и в качестве второго параметра может принимать parent-элемент, в котором нам необходимо найти нужный элемент DOM-модели.
- $find() - функция, которая очень похожа на $get(), но возвращает не DOM-элемент, а экзепмляр Ajax Client Control.
Более детальное описания использования этих функций: http://mattberseth.com/blog/2007/08/the_everuseful_get_and_find_as.html


Почему-то, всегда забываю синтаксис вызова script service/method. Руки так и тянуться написать:

var result = ScriptServiceExample.AsmxService.Hello;
или
var result = ScriptServiceExample.AsmxService.Hello();

И каждый раз, после написания такого когда приходится лезть в MSDN/Google чтобы понять почему же оно не работает. После прочтения документации становится понятно "как" нужно писать вызов метода, но вопрос "почему" ответ, как правило, находится не сразу. Чтобы понять почему же всё работает именно так, достаточно посмотреть JavaScript код, который генерируется службой. Посмотреть это можно зайдя по адресу http://localhost:65456/AsmxService.asmx/js и сохранив себе js-файл следующего содержания:

Type.registerNamespace('ScriptServiceExample');
ScriptServiceExample.AsmxService=function() {
ScriptServiceExample.AsmxService.initializeBase(this);
// ...
Hello:function(succeededCallback, failedCallback, userContext) {
return this._invoke(this._get_path(), 'Hello',false,{},succeededCallback,failedCallback,userContext); }}
// ...

С WFC AJAX-enabled службами всё работает также.

 

ScriptServiceExample.rar (7.44 kb)