Листинг 7.1

<%@ Page Language="C#"

MasterPageFile="~/Views/Shared/Site.Master"

Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="indexTitle" ContentPlaceHolderID="TitleContent"

runat="server">

Home Page

</asp:Content>

<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent"

runat="server">

<h2>

<%= Html.Encode(ViewData["Message"]) %>

</h2>

To learn more about ASP.NET MVC visit

<a href="#" title="ASP.NET MVC Website">http://asp.net/mvc</a>.

<script type="text/javascript">

function GetTime {

var xhr;

if (window.XMLHttpRequest) {

xhr = new XMLHttpRequest;

} else if (window.ActiveXObject) {

xhr = new ActiveXObj ect("Microsoft.XMLHTTP");

} else {

alert("Браузер не поддерживает XMLHttpRequest!");

}

xhr.onreadystatechange = function {

if (xhr.readyState == 4) {

document.getElementById("timeText").innerHTML =

"Время на сервере: " + xhr.responseText;

}

}

xhr.open("GET", "Home/GetTime", true);

xhr.send(null);

}

</script>

<input type="button" onclick="javascript:GetTime" value="Получить время" />

<span id="timeText">Время не получено</span>

</asp:Content>

В этом фрагменте кода создается кнопка для запроса данных с сервера, к которой привязан JavaScript-код Ajax и текстовое поле для отображения результата.

Серверный код, необходимый для работы, примитивен и представляет собой следующую реализацию действия GetTime для контроллера HomeController. Обратите внимание на использование атрибута OutputCache для предотвращения кэширования результата, которое в нашем случае не нужно:

[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]

public ActionResult GetTime

{

return Json(DateTime.Now.ToString);

}

Запустив проект, мы можем запрашивать дату и время с сервера без перезагрузки страницы и с использованием технологии Ajax (рис. 7.3).

Мы рассмотрели принцип работы Ajax на базе XMLHttpRequest на простейшем примере. В действительности все несколько сложнее. Следует учитывать возможные ошибки, которые могут возникнуть при обработке запроса, необходимо обрабатывать истечение времени ожидания ответа от сервера. Для упрощения работы с Ajax существуют специальные библиотеки и Framework, про которые речь пойдет далее.

MVC Framework и Ajax

MVC Framework, как новый и современный инструмент, конечно, поддерживает Ajax и предлагает удобные и обширные средства по работе с ним. На самом деле MVC Framework содержит два отдельных Ajax-инструмента: стандартную библиотеку с классами-помощниками и библиотеку jQuery, одной из возможностей которой является упрощенная работа с Ajax.

Ajax-функционал в MVC Framework

В состав проекта MVC Framework по умолчанию входят два JavaScript-файла: MicrosoftAjax.js и MicrosoftMvcAjax.js, в которых для разработчиков предложены вспомогательные функции при работе с Ajax. Рассмотрим их по порядку:

? MicrosoftAjax.js — основной файл, который содержит всю инфраструктуру ASP.NET для работы с Ajax. Эта библиотека может быть знакома тем, кто использовал Ajax.NET или AjaxControlToolkit в проектах на базе классического ASP.NET;

? MicrosoftMvcAjax.js — файл, осуществляющий поддержку Ajax в MVC-проектах, код которых написан с помощью специальных вспомогательных методов. Эта библиотека использует MicrosoftAjax.js для своей работы.

Для упрощения работы с Ajax MVC Framework содержит кроме JavaScript-файлов еще и расширения в виде классов и методов .NET. Так, класс viewPage, по умолчанию базовый для всех страниц MVC-проектов, содержит свойство Ajax, которое является экземпляром класса AjaxHelper.AjaxHelper содержит перечисленные в табл. 7.1 вспомогательные методы для работы с Ajax в представлениях.