Реализация на ASP.NET Ajax

Сделаем так, чтобы вход в систему был возможен на любой странице проекта (рис. 7.10). Для этого добавим разметку, необходимую для отображения элементов управления входа в систему, в элемент управления LogOnUserControl.ascx:

<% if (Request.IsAuthenticated) { %>

  Welcome <b><%= Html.Encode(Page.User.Identity.Name) %></b>!

  [ <%= Html.ActionLink("Log Off", "LogOff", "Account") %> ]

<% } else { %>

  <div id="loginPanel">

  <% using(Ajax.BeginForm("LogOn", "Account",

     (object) null,

     new AjaxOptions{OnSuccess = "OnLogon",

       OnFailure = "OnError"})) {%>

 Логин: <%= HtmL.TextBoxC'userNams'') %>

 Пароль: <%= Html.Password ("password") %>

 <%= HtmL.CheckBox("RememberMe") %> запомнить <input type^'submit" vaLue="Логин" /><br/>

 <span id="message"></span>

<% } %>

</div>

<p id="logoutPanel" style="display: none;">

  Welcome <b><span id="username"></span></b>!

  [ <%= Html.ActionLink("Log Off", "LogOff", "Account") %> ]

</p>

<% } %>

Здесь в выделенном фрагменте кода с помощью вспомогательного метода Ajax.BeginForm объявляется форма для ввода данных. Устанавливаются параметры формы: действие, контроллер, которые требуется вызвать. С помощью определения экземпляра AjaxOptions определяются параметры Ajax-запроса: при успешном запросе будет вызвана JavaScript-функция onLogon, при возникновении ошибки будет вызваана другая функция — onError. Определим логику этих JavaScript-функций, которые будут реагировать на результат Ajax-запросов (листинг 7.3).

Листинг 7.3. JavaScript-код для реагирования на события

<script type="text/javascript">

  function OnLogon(result) {

    var response = result.get_response();

    var resString = response.get_responseData();

    var resultData = Sys.Serialization

       .JavaScriptSerializer.deserialize(resString) ;

    if (resultData.IsSuccess) {

      document.getElementById('loginPanel').style.display = 'none';

      document.getElementById('logoutPanel').style.display = '';

      var username = document.getElementById('userName');

      document.getElementById('username')

          .innerHTML = "<b>" + username.value + "</b>";

    } else {

      document.getElementById('message')

         .innerText = resultData.ErrorString;

    }

  }

  function OnError(result) {

    alert(result);

  }

</script>

Здесь определяются две JavaScript-функции: OnLogon и OnError. Первая функция предназначена для обработки результата успешного выполнения авторизации. Функция OnLogon принимает один параметр — result, который содержит результат выполнения запроса и дополнительные данные. Для получения JSON-данных, которые были получены от действия LogOn, в функции OnLogon используются сужебные функции ASP.NET Ajax:

□ get_response — возвращает объект с данными ответа от сервера;

□ get_responseData — позволяет получить строку данных, которые были возвращены действием контроллера;

□ Sys.Serialization.JavaScriptSerializer.deserialize — преобразует строку с JSON-данными в объект с соответствующими полями.

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