Шрифт:
"CheckUsername",
new AjaxOptions {OnBegin ="CheckUsername_OnBegin"
, UpdateTargetld =
"check_username"}
)
%>
<span id="check_username"></span>
Здесь с помощью вспомогательного метода Ajax.ActionLink создается гиперссылка для вызова действия CheckUsername. C помощью создания структуры типа AjaxOptions мы задаем несколько параметров. Во-первых, мы задаем функцию CheckUsername_OnBegin, которая должна быть вызвана перед запросом, а во-вторых, указываем тег с идентификатором check_username, который должен быть использован для рендеринга результата.
К сожалению, базовый функционал ASP.NET Ajax пока не поддерживает возможность задавать динамические параметры для запросов, формируемых через Ajax.ActionLink. Поэтому, чтобы передать с запросом введенные пользователем данные, нам нужно обработать начало запроса и сформировать самостоятельно URL запроса с необходимой строкой параметров. Чтобы сделать это, мы задали функцию CheckUsername_OnBegin, код которой выглядит так:
<script type="text/javascript">
function CheckUsername_OnBegin(data) {
var username = document.getElementById("username").value;
var request = data.get_request;
var url = request.get_url;
url = url + "?username=" + username;
request.set_url(url);
}
</script>
Здесь производится получение URL запроса и формирование нового URL на базе введенных пользовательских данных. Последней строкой скрипта новый URL устанавливается для Ajax-запроса.
В итоге после компиляции на странице регистрации мы сможем увидеть рядом с полем ввода имени пользователя ссылку для проверки на допустимость такого логина (рис. 7.8). После нажатия кнопки пользователь получает результат проверки в виде строки сообщения (рис. 7.9).
Рис. 7.8. Форма регистрации с гиперссылкой на проверку доступности логина
Реализация на jQuery
Посмотрим, насколько реализация проверки на наличие логина на jQuery отличается от описанной ранее реализации на ASP.NET Ajax. Во-первых, определим гиперссылку для проверки логина пользователя:
<label for="username">Username:</label>
<%= Html.TextBox("username") %>
<%= Html.ValidationMessage("username") %>
<a id="checkUsername" href="#">Проверить доступность логина</а>
<span id="check_username"></span>
Как можно заметить, определение гиперссылки является простым определением разметки, которая ничем не отличается от обычной. Основная работа ложится на код JavaScript, который представлен далее:
<script type="text/javascript">
$(document).ready(function {
$("#checkUsername").bind("click",
function {
var username = $("#username").val;
$("#check_username")
.load("/Account/CheckUsername?username=" + username);
})
});
</script>
Здесь мы объявляем глобальный обработчик, который выполнится после загрузки документа $(document).ready (...). В этом обработчике мы задаем поведение для обработки нажатия пользователя на необходимую нам ссылку с идентификатором $("#checkUsername").bind("click", ...). В самом обработчике нажатия производятся следующие действия: получается значение введенного пользователем логина и с помощью функции load производится запрос на сервер для проверки пользовательских данных.
Нетрудно заметить, что в случае с jQuery нам пришлось произвести меньше действий. Во-первых, вместо определения серверного кода с определением Ajax.ActionLink мы сформировали с помощью HTML-разметки обыкновенную ссылку. Во-вторых, для передачи параметра с пользовательскими данными в случае jQuery нам не пришлось работать с внутренними объектами ASP.NET Ajax, вместо этого мы работали со ссылкой напрямую, сформировав ссылку для запроса обыкновенным сложением строк. И в-третьих, само количество кода для jQuery оказалось меньшим, чем потребовалось написать кода для ASP.NET Ajax.
Примечание
Следует заметить, что передача на сервер пользовательского ввода всегда сопряжена с опасностью. Злоумышленник может ввести в виде текста опасный код, например кусок SQL-кода или JavaScript-кода, который затем, в случае когда не проводится проверка пользовательского ввода, будет исполнен вашим сервером или браузером на компьютерах ваших пользователей. Чтобы избежать этого, необходимо всегда обрабатывать пользовательский ввод и учитывать его потенциальную опасность.