Шрифт:
Событие ajaxError, кроме перечисленных трех, содержит четвертый параметр:
? thrownError — объект, который содержит информацию о произошедшей ошибке.
Использовать данные события достаточно просто. Рассмотрим пример, который выводит пользователю сообщение о старте Ajax-запроса, скрывает кнопку, для предотвращения повторного запроса, и возвращает ее после того, как запрос выполнился. Для этого модифицируем код функции GetTime и разметку так, как представлено в следующем фрагменте:
<script type="text/javascript">
function GetTime {
$('#requestStatus').ajaxStart(function {
$(this).text('Запрос запушен...');
$('#ajaxSend').hide;
});
$('#requestStatus').ajaxStop(function {
$(this).text('Запрос завершен...');
$('#ajaxSend').show;
});
$.get('Home/GetTime',
null,
function(result) {
$('#timeText').text('Bpeмя на сервере: ' + result);
});
}
</script>
<span id="requestStatus">Нажмите кнопку для 3anpoca</span><br/>
<input id="ajaxSend"
type="button"
onclick="javascript:GetTime"
value="Получить время" />
<span id="timeText">Время не получено</span>
Здесь представлена разметка для элемента requestStatus с отображением статуса Ajax-запроса, кнопки ajaxSend и элемента timeText для отображения результата запроса. В JavaScript-коде определены две функции для обработки ajaxStart и ajaxStop, которые отображают статус текущего состояния запроса и скрывают или показывают кнопку в зависимости от состояния. Для более явной демонстрации действия событий jQuery добавим в функцию GetTime контроллера HomeController задержку выполнения, чтобы увидеть, как изменяется сообщение о статусе запроса:
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
public ActionResult GetTime
{
Thread.Sleep(1000);
return Json(DateTime.Now.ToString);
}
Теперь, если пользователь нажмет кнопку Получить время, состояние запроса будет выведено в специальном поле (рис. 7.6). После получения результата поле состояния соответственно изменится (рис. 7.7).
Мы рассмотрели jQuery API, которое позволяет значительно упростить работу с Ajax-запросами как в целом, так и для частых практических ситуаций. Как мы убедились, некоторые варианты использования Ajax в jQuery могут состоять всего из одной строки текста. В следующей части главы мы рассмотрим применение jQuery более подробно.
Применение Ajax и jQuery в MVC Framework
Рассмотрим применение инструментов Ajax в MVC Framework на конкретных примерах. Для этого реализуем несколько простых сценариев в проекте MVC Framework по умолчанию. Чтобы охватить как можно больше, реализация будет выполнена в двух вариантах: с помощью ASP.NET Ajax и с помощью jQuery.
Пример 1. Проверка логина при регистрации
Первый пример, который мы рассмотрим, является решением частой задачи с помощью Ajax. В этом примере на форме регистрации добавляется функциональность по проверке введенного нового имени пользователя на наличие в базе данных. Задача проста: проверить, не является ли имя, которое себе выбрал пользователь, уже существующим на сайте.
Первоначально создадим действие Checkusername в контроллере Accountcontroller для реализации проверки на наличие имени пользователя на сайте. Далее представлен код метода checkusername, который принимает один строковый параметр username:
public ActionResult CheckUsername(string username)
{
string result;
if (String.IsNullOrEmpty(username))
{
result = "не указано имя пользователя";
}
else
{
var users = Membership.FindUsersByName(username);
result = users.Count > 0 ?
"такой пользователь уже существует" :
"ваше имя пользователя не занято";
}
return Json(result);
}
Данный метод принимает параметр с именем пользователя для проверки существования регистрации пользователя с таким именем. Метод CheckUsername возвращает строковое представление результата проверки.
Для вызова этого метода необходимо создать соответствующую разметку.
Реализация на ASP.NET Ajax
Добавим в Register.aspx ссылку для проверки введенного логина на наличие плюс поле для вывода результата проверки:
<label for="username">Username:</label>
<%= Html.TextBox("username") %>
<%= Html.ValidationMessage("username") %>
<%= Ajax.ActionLink("Пpoверить доступность логина",