Литмир - Электронная Библиотека

□ routeValues — указывает объект, содержащий параметры для механизма маршрутизации;

□ ajaxOptions — указывает экземпляр класса AjaxOptions с заданными свойствами, которые определяют параметры асинхронного запроса и могут определять ряд JavaScript-функций, реагирующих на изменение состояния запроса;

□ htmlAttributes — набор значений пользовательских атрибутов для тега a, которые должны быть помещены в разметку формы.

Применение ActionLink еще проще, рассмотрим его использование на примере получения даты и времени для отображения на странице:

<%= Ajax.ActioriLink(''Пaлучить время", "GetTime", "Home",

 new AjaxOptions() { UpdateTargetId = "timeText" },

 (object) null) %><br />

<span id="timeText">Нажмите на ссылку для получения времени<sрап>

Здесь с помощью вспомогательного метода Ajax.ActionLink создается ссылка, которая с помощью Ajax.NET скрытно связывается с асинхронным запросом на сервер. Кроме текста ссылки, наименования действия и контроллера, в функцию передается набор параметров AjaxOptions, в котором, в нашем случае, параметр UpdateTargetId устанавливается равным идентификатору элемента, где будет отображен результат запроса. В последний параметр, который определяет значение атрибутов HTML-элемента, передается значение (object) null, чтобы указать, что никаких дополнительных HTML-атрибутов рендерить не нужно.

Как и в случае использования Ajax.BeginForm, при рендеринге Ajax.ActionLink незаметно для разработчика создается вспомогательный код, который реализует весь Ajax-функционал, избавляя разработчика от написания рутинного кода:

<a href="/Home/GetTime?Length=4"

onclick="Sys.Mvc.AsyncHyperlink.handleClick(this,

 new Sys.UI.DomEvent(event),

{

  insertionMode: Sys.Mvc.InsertionMode.replace, updateTargetId: 'timeText'

});">Получить время</a>

После того как пользователь нажмет на ссылку, сформируется асинхронный запрос на сервер, и полученный результат будет выведен в элемент span с идентификатором timeText.

IsAjaxRequest

Метод IsAjaxRequest является методом расширения для класса HttpRequestBase. Данный метод возвращает булево значение, которое сообщает, является ли текущй запрос Ajax-запросом или нет. IsAjaxRequest может быть полезен тогда, когда ваше действие меняет логику в зависимости от типа запроса. Например, в следующем примере представлена реализация действия, в котором в зависимости от типа запроса возвращается либо набор данных, либо данные с готовой HTML-разметкой:

public ActionResult GetTime()

{

  if (Request.IsAjaxRequestO)

  {

    return Json(DateTime.Now.ToString());

  } else

    return View(DateTime.Now.ToString());

}

jQuery

С недавних пор jQuery стала частью пакета Visual Studio. В среде разработчиков, работающих с JavaScript, jQuery зарекомендовала себя очень хорошо, и разработчики пакета Visual Studio решили не изобретать свой вариант JavaScript-библиотеки для работы с селекторами и DOM-моделью документа, когда встал такой вопрос, а взять готовый мощный отлаженный и знакомый многим разработчикам инструмент.

Одна из самых главных возможностей, которую предлагает jQuery, — это написание JavaScript-кода для работы с объектной моделью документа, основанного на селекторах CSS3. Селекторы CSS3 — это возможность назначить CSS-стиль не просто отдельному элементу в документе по его классу или идентификатору, но выбрать целый ряд элементов согласно некому общему признаку. Например, следующий CSS-код устанавливает стиль всем вложенным элементам li относительно элементов с классом . list:

.list > li {

  color: #FFFFFF;

}

CSS-селекторы содержат гибкие варианты и операторы для доступа к элементам DOM для самых различных сценариев. Поддержка CSS-селекторов библиотекой jQuery означает, что вы получаете возможность проще выбирать часть объектов модели документа, используя знакомый CSS-синтаксис и минимум кода.

Примечание

Описание CSS-селекторов выходит за рамки этой статьи. Достаточно сказать лишь, что это важнейший и мощный инструмент по работе с DOM-моделью документа, и jQuery позволяет работать с dom на базе набора последней, третьей версии CSS-селекторов.

*********************************

Библиотека jQuery представлена в Visual Studio двумя JS-файлами: jquery-1.3.1js и jquery-1.3.1.min.js (на момент написания книги). Эти файлы идентичны по функционалу и отличаются только тем, что второй вариант минимизирован, т. е. текст его максимально оптимизирован для уменьшения размера (убраны переносы, лишние пробелы и выполнены другие оптимизации). Обычно первый вариант библиотеки используют при разработке и отладке, поскольку, кроме читаемого кода, библиотека содержит массу полезных комментариев. Второй вариант, специально уменьшенный, используется уже на реальном применении.

Для упрощения работы с библиотекой Visual Studio содержит специальные файлы *- vsdocjs, которые необходимы для поддержки IntelliSense при работе с функциями и свойствами jQuery. Чтобы использовать эти файлы, вам необходимо иметь Visual Studio 2008 с первым сервис-паком и установленным обновлением VS90SP1-KB958502-x86. Если у вас установлено это обновление, то после подключения скрипта jQuery к странице через тег script, вы получите возможность работать с функциями и свойствами библиотеки jQuery с помощью IntelliSense (рис. 7.5).

jQuery содержит ряд фукций по работе с Ajax, перечислим их и приведем основное назначение:

□ jQuery.ajax — выполняет Ajax-запрос на сервер;

□ load — выполняет Ajax-запрос на сервер и вставляет результат в DOM страницы;

□ jQuery.get — упрощенная версия jQuery.ajax, которая позволяет посылать GET-запросы на сервер с помощью Ajax;

□ jQuery .getJSON — версия jQuery.get, которая загружает с сервера данные в формате JSON с помощью Ajax-запросов;

□ jQuery.getscript — загружает с помощью Ajax текст JavaScript-кода и исполняет его;

□ jQuery.post — загружает данные с сервера с использованием Ajax и POST-запроса.

Asp.net mvc framework - img_57

Кроме данных функций, jQuery содержит набор из нескольких событий и вспомогательных функций, которые будут рассмотрены в следующей части главы, посвященной jQuery.

Рассмотрим использование jQuery на примере решения знакомой нам задачи с выводом текущей даты и времени на сервере с помощью Ajax-запроса. Для этого перепишем функцию GetTime из предыдущей JavaScript-реализации на jQuery:

<script type="text/javascript">

  function GetTime() {

    $.get("Home/GetTime", null, function(result) {

        $('#timeText').text('Bpeмя на сервере: ' + result);

    }, "text")

  }

</script>

Сравните JavaScript-реализацию без вспомогательных библиотек с 20 строками и jQuery с шестью. Разница очевидна: использование jQuery не требует ни организации поддержки всех браузеров, ни обработки получения результата и состояния запроса. Все это низкоуровневое взаимодействие jQuery берет на себя. В приведенном примере использована функция jQuery $.get ($ — это синоним объекта jQuery). В функцию get передаются следующие параметры:

56
{"b":"971383","o":1}