Отображение экранной заставки в период ожидания

Еще одна приятная особенность UpdatePanel заключается в возможности отображать экранную заставку во время ожидания получения новых данных от сервера, особенно если генерирование данных на сервере занимает продолжительное время (например, при выполнении сложных операций в базе данных). Простой баннер с надписью «loading» (загрузка) сообщит пользователю, что идет обработка запроса и в настоящий момент невозможно выполнить повторную отправку данных формы.

В следующем примере имитируется медленная работа сценария на стороне сервера, что вынуждает ASP.NET AJAX вывести экранную заставку до того момента, пока сценарий не завершит работу.

Для начала создадим медленный серверный сценарий. Этот сценарий просто ничего не делает в течение пяти секунд.
void WaitFiveSeconds(object o, EventArgs e)
{
System.Threading.Thread.Sleep(5000);
}

Запуск сценария производится щелчком на кнопке, расположенной в элементе управления UpdatePanel. После щелчка на кнопке сценарий будет работать в течение пяти секунд.
(asp:UpdatePanel ID="UpdatePanel1" runat="server")

(asp:Button ID="Button1" runat="server"
Text="Do something" OnClick="WaitFiveSeconds" /)

(/asp:UpdatePanel)

В завершение реализуем экранную заставку.


Для этого в ASP.NET AJAX имеется элемент управления UpdateProgress. Внутри этого компонента в элемент следует поместить разметку HTML (или ASP.NET). После этого всякий раз, когда будет происходить обновление UpdatePanel, на странице будет отображаться содержимое шаблона элемента UpdateProgress. По окончании процесса обновления UpdatePanel содержимое опять станет невидимым. На одних сайтах в качестве экранной заставки используется изображение песочных часов, на других обычный текст, например: «loading...» («загрузка...»).

(asp:UpdateProgress ID="UpdateProgress1" runat="server")

Loading ... Please stand by ...


(/asp:UpdateProgress)

Для организации совместной работы элементы UpdatePanel и UpdateProgress необходимо связать между собой, для этой цели в последнем из них имеется свойство AssociatedUpdatePanelID. В примере 6.4 содержится полный программный код этого примера.
Пример 6.4. Экранная заставка в элементе UpdatePanel UpdateProgress.aspx
<%@ Page Language="C#" %>
"http://www.w3.org/TR/xhtml1/DTD/xhtml1?transitional.dtd">
ASP.NET AJAX

(body)
(asp:ScriptManager ID="ScriptManager1" runat="server" /)
(asp:UpdatePanel ID="UpdatePanel1" runat="server")

(asp:Button ID="Button1" runat="server"
Text="Do something" OnClick="WaitFiveSeconds" /)(br /)
(asp:Label ID="Label1" runat="server" /)

(/asp:UpdatePanel)
(asp:UpdateProgress ID="UpdateProgress1" runat="server"
AssociatedUpdatePanelID="UpdatePanel1")

Loading, please stand by ...


(/asp:UpdateProgress)

(/body)
.



Оцените статью: (0 голосов)
0 5 0

Статьи из раздела ASP.NET AJAX на эту тему:
Обновление части страницы
Обновление части страницы через определенные интервалы времени
Программное обновление части страницы через определенные интервалы времени
Создание обновляемой области страницы
Управление асинхронными запросами