Управление журналом веб-обозревателя с помощью серверных элементов управления ASP.NET
Обновлен: Ноябрь 2007
Разработчик страницы имеет возможность управлять записями журнала веб-обозревателя и обеспечивать логическую навигацию путем использования серверных элементов управления ScriptManager и ScriptManagerProxy. Серверный элемент управления ScriptManager позволяет устанавливать точки предыдущих состояний в приложении. Оба элемента управления позволяют обрабатывать переходы, имеющие место при запросе веб-страницы в каком-либо предыдущем состоянии.
Точка предыдущего состояния представляет собой точку логической навигации в веб-приложении, которая может быть представлена посредством сведений о состоянии. Сведения о состоянии могут использоваться для восстановления одного из предыдущих состояний веб-приложения либо непосредственно по данным состояния, либо посредством идентификатора сведений о состоянии, хранимых в другом месте.
Точки предыдущих состояний хранятся в стеке журнала веб-обозревателя только в виде URL-адресов. Предыдущим состоянием манипулируют как данными в строке запроса или как фрагментом URL-адреса, помеченным символом "#". В связи с ограничениями на размер URL-адресов создаваемые сведения о состоянии должны быть минимального размера. В следующем примере показан URL-адрес, содержащий достаточное количество данных о точке предыдущего состояния для идентификации состояния. По этим данным приложение сможет воссоздать страницу в том состоянии.
http://MySamples/Ajax/Default.aspx#&&state=2
Когда пользователь нажимает в обозревателе кнопку Назад, обозреватель переходит к ранее просмотренным URL-адресам, в числе которых будут и URL-адреса, содержащие данные о предыдущих состояниях. Клиентский код на веб-странице обнаруживает, что URL-адрес содержит данные о предыдущих состояниях (либо сервера, либо клиента) и делает запрос к странице, передавая сведения о состоянии. При обработке запроса страница считывает сведения о предыдущем состоянии и инициирует асинхронную обратную передачу. Затем серверные элементы управления ScriptManager и ScriptManagerProxy создают событие Navigate. Это событие можно обработать и повторно создать страницу в том виде, в котором она необходима веб-приложению.
.gif "Примечание") Примечание. |
|---|
Для построения примеров кода в этом разделе необходимо располагать Visual Studio 2008 с пакетом обновления 1 или более поздней версии. |
Синтаксис элементов управления ScriptManager и ScriptManagerProxy
В следующем примере показан синтаксис серверного элемента управления ScriptManager для работы с журналом веб-обозревателя.
<asp:ScriptManager runat="server"
EnableHistory="true|false"
EnableStateHash="true|false"
OnNavigate="navigateEventhandlerName">
</asp:ScriptManager>
Включение управления журналом веб-обозревателя
Для использования управления журналом веб-обозревателя необходимо включить поддержку этой функции с помощью серверного элемента управления ScriptManager. По умолчанию поддержка работы с журналом не включена. При включении она реализуется по-разному для каждого веб-обозревателя. В случае Internet Explorer в обозревателе отрисовывается элемент iframe, что может стать причиной дополнительного запроса к серверу. Поэтому данная функция включается по требованию. В следующем примере показано декларативное включение работы с журналом посредством элемента управления ScriptManager.
<asp:ScriptManager runat="server" ID="ScriptManager1"
EnableHistory="true" />
Создание точек предыдущих состояний в веб-обозревателе
Для создания точки предыдущего состояния в веб-обозревателе вызывается метод AddHistoryPoint элемента управления ScriptManager. Этот метод позволяет определить состояние сервера и ключи, а также при необходимости данные, которые будут использоваться в качестве названия записи в журнале обозревателя. Данные состояния можно использовать для повторного создания страницы при последующем вызове события перехода по журналу. При создании точки предыдущего состояния по умолчанию сериализованные и зашифрованные данные добавляются к URL-адресу веб-страницы. Полученный URL-адрес добавляется в стек журнала веб-обозревателя.
| Примечание. |
|---|
Добавлять точки предыдущих состояний следует только в ответ на действия пользователя, такие как щелчок выделенного элемента. Как правило, точки предыдущих состояний как результат исключительно выполнения кода приложения не добавляются. |
В следующем примере для включения асинхронной обратной передачи на странице используется элемент управления UpdatePanel. Элемент управления ScriptManager используется для добавления точек предыдущих состояний во время работы обработчика событий Click для кнопок, инициирующих асинхронную обратную передачу. При нажатии кнопки Назад в обозревателе пользователь не уходит с веб-страницы, а вместо этого переходит к предыдущим состояниям страницы.
Запустите пример этой функции в Интернете.
<%@ Page Language="VB" %>
<%@ Import Namespace="System.Globalization" %>
<%@ Import Namespace="System.Collections.Generic" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
Private Shared key As String = "s"
' Handle the Navigate event
Public Sub OnNavigateHistory(ByVal sender As Object, ByVal e As HistoryEventArgs)
LabelHistoryData.Text = Server.HtmlEncode(e.State(key))
End Sub
' On button click, handle the event and set a history point.
Public Sub ButtonClick(ByVal sender As Object, ByVal e As EventArgs)
LabelHistoryData.Text = CType(sender, Button).Text
ScriptManager.GetCurrent(Me).AddHistoryPoint(key, LabelHistoryData.Text)
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Microsoft ASP.NET 3.5 Extensions: Managing History</title>
<link href="../../include/qsstyle.css" type="text/css" rel="Stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server" ID="ScriptManager1" OnNavigate="OnNavigateHistory"
EnableHistory="true" EnableSecureHistoryState="false" />
<h2>
Microsoft ASP.NET 3.5 Extensions: Adding Server-side Browser History Points</h2>
<p/>
<div id="Div1" class="new">
<p>This sample shows:</p>
<ol>
<li>How to use the <code>ScriptManager</code> control to set a history point.</li>
<li>The <code>ScriptManager</code> control, the <code>EnableHistory</code> and
<code>EnableSecureHistoryState</code> properties and
the <code>OnNavigate</code> property to handle the <code>navigate</code>event.<br />
</li>
</ol>
</div>
<p>
In this example, three buttons outside the <code>UpdatePanel</code> control can
trigger an asynchronous postback. You can see the results of the update through
the date and time that renders in the Web page along with a value indicating the
button that triggered the partial refresh.</p>
<p>
When you press a button, the server-side <code>Click</code> event handler for the button
stores data and uses the data as a history point. If you click the browser's Back button,
you will see the state Web page return to a previous button value, representing the previous
button you pressed. However, you will see that the time within the Web page continues to be
incremented.
</p>
<p>To see the effect of this logic, do the following.</p>
<ol>
<li>Press <b>1</b>. See the panel refresh.</li>
<li>Press <b>3</b>. See the panel refresh.</li>
<li>Press <b>2</b>. See the panel refresh.</li>
<li>Press the browser's Back button. Note that the panel is refreshed with previous
data, but the date and time are updated to current values.</li>
</ol>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button3" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Panel runat="server" CssClass="box" ID="Content" Height="40px">
Date and Time:
<%= DateTime.Now.ToLongTimeString() %>
<br />
Page's refresh state:
<asp:Label runat="server" ID="LabelHistoryData" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<p />
<asp:Button runat="server" ID="Button1" Text="Key 1" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button2" Text="Key 2" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button3" Text="Key 3" OnClick="ButtonClick" />
</div>
</form>
</body>
</html>
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Globalization" %>
<%@ Import Namespace="System.Collections.Generic" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
private static String key = "s";
// Handle the Navigate event
public void OnNavigateHistory(object sender, HistoryEventArgs e) {
LabelHistoryData.Text = Server.HtmlEncode(e.State[key]);
}
// On button click, handle the event and set a history point.
public void ButtonClick(object sender, EventArgs e) {
LabelHistoryData.Text = ((Button)sender).Text;
ScriptManager.GetCurrent(this).AddHistoryPoint(key, LabelHistoryData.Text);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Microsoft ASP.NET 3.5 Extensions: Managing History</title>
<link href="../../include/qsstyle.css" type="text/css" rel="Stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server" ID="ScriptManager1" OnNavigate="OnNavigateHistory"
EnableHistory="true" EnableSecureHistoryState="false" />
<h2>
Microsoft ASP.NET 3.5 Extensions: Adding Server-side Browser History Points</h2>
<p/>
<div id="Div1" class="new">
<p>This sample shows:</p>
<ol>
<li>How to use the <code>ScriptManager</code> control to set a history point.</li>
<li>The <code>ScriptManager</code> control, the <code>EnableHistory</code> and
<code>EnableSecureHistoryState</code> properties and
the <code>OnNavigate</code> property to handle the <code>navigate</code>event.<br />
</li>
</ol>
</div>
<p>
In this example, three buttons outside the <code>UpdatePanel</code> control can
trigger an asynchronous postback. You can see the results of the update through
the date and time that renders in the Web page along with a value indicating the
button that triggered the partial refresh.</p>
<p>
When you press a button, the server-side <code>Click</code> event handler for the button
stores data and uses the data as a history point. If you click the browser's Back button,
you will see the state Web page return to a previous button value, representing the previous
button you pressed. However, you will see that the time within the Web page continues to be
incremented.
</p>
<p>To see the effect of this logic, do the following.</p>
<ol>
<li>Press <b>1</b>. See the panel refresh.</li>
<li>Press <b>3</b>. See the panel refresh.</li>
<li>Press <b>2</b>. See the panel refresh.</li>
<li>Press the browser's Back button. Note that the panel is refreshed with previous
data, but the date and time are updated to current values.</li>
</ol>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button3" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Panel runat="server" CssClass="box" ID="Content" Height="40px">
Date and Time:
<%= DateTime.Now.ToLongTimeString() %>
<br />
Page's refresh state:
<asp:Label runat="server" ID="LabelHistoryData" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<p />
<asp:Button runat="server" ID="Button1" Text="Key 1" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button2" Text="Key 2" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button3" Text="Key 3" OnClick="ButtonClick" />
</div>
</form>
</body>
</html>
Обработка запросов к серверу
При обнаружении в запросе состояния сервера создается событие Navigate. Это выглядит как асинхронная обратная передача на сервер. Если требуется определить, имела ли обратная передача место для перехода или в каких-либо других целях, можно считать свойство IsNavigating. Если значение этого свойства равно true, обратная передача была инициирована вызовом перехода.
В следующем примере показан серверный элемент управления Wizard внутри элемента управления UpdatePanel. В результате элемент управления Wizard выполняет асинхронную обратную передачу при переходе пользователя между окнами мастера. В этом примере код добавляет точки предыдущих состояний, когда пользователь переходит на следующий или предыдущий шаг мастера.
Запустите пример этой функции в Интернете.
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
Private Shared stepKey As String = "s"
Protected Sub OnNavigateHistory(ByVal sender As Object, ByVal args As HistoryEventArgs)
Dim stateString As String = args.State(stepKey)
Dim [step] As Integer = If(stateString IsNot Nothing, Integer.Parse(stateString), 0)
MachineConfiguratorWizard.ActiveStepIndex = [step]
End Sub
Protected Sub OnActiveStepChanged(ByVal sender As Object, ByVal e As EventArgs)
If Not ScriptManager1.IsNavigating AndAlso IsPostBack Then
Dim index As Integer = MachineConfiguratorWizard.ActiveStepIndex
ScriptManager1.AddHistoryPoint(stepKey, index.ToString(), "Step " + (index + 1).ToString())
End If
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Microsoft ASP.NET 3.5 Extensions: Managing History</title>
<link href="../../include/qsstyle.css" type="text/css" rel="Stylesheet" />
</head>
<body>
<div>
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server" ID="ScriptManager1" OnNavigate="OnNavigateHistory"
EnableHistory="true" EnableSecureHistoryState="false" />
<h2>
Microsoft ASP.NET 3.5 Extensions: Adding Server-side Browser History Points</h2>
<p/>
<div id="Div1" class="new">
<p>This sample shows:</p>
<ol>
<li>How to use the <code>ScriptManager</code> control to set a history point.</li>
<li>The <code>ScriptManager</code> control, the <code>EnableHistory</code> and
<code>EnableSecureHistoryState</code> properties and
the <code>OnNavigate</code> property to handle the <code>navigate</code> event.
</li>
<li>Protecting the history code with <code>IsNavigating</code>
</li>
</ol>
</div>
<p>
In this example, the <code>Wizard</code> server control provides it's own navigation, but
as each step is selected a history point is added. In order to do this, a history point is only added if the page is not being refreshed beacuse of a history point.</p>
<asp:UpdatePanel runat="server" ID="WizardPanel">
<ContentTemplate>
<asp:Wizard ID="MachineConfiguratorWizard" runat="server" ActiveStepIndex="0" BackColor="#dddddd"
BorderWidth="10" CellPadding="10" CellSpacing="10" Height="200px" Width="700px"
FinishPreviousButtonText="<" StartNextButtonText=">" StepNextButtonText=">" StepPreviousButtonText="<"
FinishCompleteButtonText="<|>" OnActiveStepChanged="OnActiveStepChanged">
<WizardSteps>
<asp:WizardStep ID="Step1" runat="server" Title="Step 1">
<h2>
STEP 1</h2>
<br />
</asp:WizardStep>
<asp:WizardStep ID="Step2" runat="server" Title="Step 2">
<h2>
STEP 2</h2>
<br />
</asp:WizardStep>
<asp:WizardStep ID="Step3" runat="server" Title="Step 3">
<h2>
STEP 3</h2>
<br />
</asp:WizardStep>
</WizardSteps>
<StepStyle Font-Names="tahoma" Font-Size="Smaller" VerticalAlign="Top" />
<SideBarStyle Font-Size="Small" VerticalAlign="Top" BackColor="#FFFFC0" Font-Names="tahoma" />
<FinishPreviousButtonStyle BackColor="White" BorderColor="Black" BorderWidth="3px"
Font-Names="Tahoma" Font-Size="Medium" />
<NavigationButtonStyle BackColor="White" BorderColor="Black" BorderStyle="Solid"
BorderWidth="3px" Font-Names="Tahoma" Font-Size="Medium" />
<FinishCompleteButtonStyle Font-Names="Tahoma" Font-Size="Medium" />
</asp:Wizard>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
private static readonly string stepKey = "s";
protected void OnNavigateHistory(object sender, HistoryEventArgs args)
{
string stateString = args.State[stepKey];
int step = (stateString != null) ? int.Parse(stateString) : 0;
MachineConfiguratorWizard.ActiveStepIndex = step;
}
protected void OnActiveStepChanged(object sender, EventArgs e)
{
if (!ScriptManager1.IsNavigating && IsPostBack) {
int index = MachineConfiguratorWizard.ActiveStepIndex;
ScriptManager1.AddHistoryPoint(stepKey, index.ToString(), "Step " + (index+1).ToString());
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Microsoft ASP.NET 3.5 Extensions: Managing History</title>
<link href="../../include/qsstyle.css" type="text/css" rel="Stylesheet" />
</head>
<body>
<div>
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server" ID="ScriptManager1" OnNavigate="OnNavigateHistory"
EnableHistory="true" EnableSecureHistoryState="false" />
<h2>
Microsoft ASP.NET 3.5 Extensions: Adding Server-side Browser History Points</h2>
<p/>
<div id="Div1" class="new">
<p>This sample shows:</p>
<ol>
<li>How to use the <code>ScriptManager</code> control to set a history point.</li>
<li>The <code>ScriptManager</code> control, the <code>EnableHistory</code> and
<code>EnableSecureHistoryState</code> properties and
the <code>OnNavigate</code> property to handle the <code>navigate</code> event.
</li>
<li>Protecting the history code with <code>IsNavigating</code>
</li>
</ol>
</div>
<p>
In this example, the <code>Wizard</code> server control provides it's own navigation, but
as each step is selected a history point is added. In order to do this, a history point is only added if the page is not being refreshed beacuse of a history point.</p>
<asp:UpdatePanel runat="server" ID="WizardPanel">
<ContentTemplate>
<asp:Wizard ID="MachineConfiguratorWizard" runat="server" ActiveStepIndex="0" BackColor="#dddddd"
BorderWidth="10" CellPadding="10" CellSpacing="10" Height="200px" Width="700px"
FinishPreviousButtonText="<" StartNextButtonText=">" StepNextButtonText=">" StepPreviousButtonText="<"
FinishCompleteButtonText="<|>" OnActiveStepChanged="OnActiveStepChanged">
<WizardSteps>
<asp:WizardStep ID="Step1" runat="server" Title="Step 1">
<h2>
STEP 1</h2>
<br />
</asp:WizardStep>
<asp:WizardStep ID="Step2" runat="server" Title="Step 2">
<h2>
STEP 2</h2>
<br />
</asp:WizardStep>
<asp:WizardStep ID="Step3" runat="server" Title="Step 3">
<h2>
STEP 3</h2>
<br />
</asp:WizardStep>
</WizardSteps>
<StepStyle Font-Names="tahoma" Font-Size="Smaller" VerticalAlign="Top" />
<SideBarStyle Font-Size="Small" VerticalAlign="Top" BackColor="#FFFFC0" Font-Names="tahoma" />
<FinishPreviousButtonStyle BackColor="White" BorderColor="Black" BorderWidth="3px"
Font-Names="Tahoma" Font-Size="Medium" />
<NavigationButtonStyle BackColor="White" BorderColor="Black" BorderStyle="Solid"
BorderWidth="3px" Font-Names="Tahoma" Font-Size="Medium" />
<FinishCompleteButtonStyle Font-Names="Tahoma" Font-Size="Medium" />
</asp:Wizard>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
URL-адреса и предыдущее состояние сервера
При создании точки предыдущего состояния разработчик решает, какие сведения сохранять в качестве состояния для этой точки. Как минимум требуется пара "ключ-значение", идентифицирующая состояние с точки зрения приложения. При необходимости можно сохранять дополнительные пары "ключ-значение". Однако поскольку эти сведения сохраняются в URL-адресе и на размер URL-адресов накладываются ограничения (определяемые конкретным веб-обозревателем), сохранять следует только сведения, необходимые для воссоздания состояния.
В URL-адресе сведения о состоянии сервера могут указываться в хэшированном либо в нехэшированном виде в зависимости от значения свойства EnableHistory серверного элемента управления ScriptManager.
Предыдущее состояние в URL-адресе отделяется символом # (разделителем фрагментов). Сведения о состоянии указываются после оператора "&&", как показано в следующем примере.
Default.aspx#&&s=Key+2
Если установить значение свойства EnableHistory равным true, фрагмент предыдущего состояния будет шифроваться перед добавлением в URL-адрес веб-страницы. Это повышает безопасность, усложняя изменение данных состояния злоумышленником. Тем не менее, даже хотя сведения шифруются, сохранять конфиденциальные данные в поле состояния не следует.
Следует отметить, что при хэшировании сведений о состоянии создаются URL-адреса достаточно большой длины и содержащие информацию, не несущую смысла для пользователя.
Добавление названий точкам предыдущих состояний
Записи в стеке журнала веб-обозревателя обычно обозначаются заголовками страниц, соответствующих записям. В качестве примера просмотрите журнал своего обозревателя — вы увидите заголовки последних посещенных страниц. (Обычно увидеть список можно в раскрывающемся списке в поле URL-адреса.)
При создании в приложении точки предыдущего состояния по умолчанию в качестве идентификатора записи используется заголовок страницы. При добавлении нескольких точек предыдущих состояний с одной и той же страницы по умолчанию все записи будут иметь одинаковое название.
Существует, однако, возможность давать отдельным записям журнала содержательные названия. В серверном коде при создании точки предыдущего состояния путем вызова метода AddHistoryPoint можно включить сведения для названия.
В следующем примере показан вариант предыдущего примера с добавлением названия записи.
Запустите пример этой функции в Интернете.
<%@ Page Language="VB" %>
<%@ Import Namespace="System.Globalization" %>
<%@ Import Namespace="System.Collections.Generic" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
Private Shared key As String = "s"
' Handle the Navigate event
Public Sub OnNavigateHistory(ByVal sender As Object, ByVal e As HistoryEventArgs)
LabelHistoryData.Text = Server.HtmlEncode(e.State(key))
End Sub
' On button click, handle the event and set a history point.
Public Sub ButtonClick(ByVal sender As Object, ByVal e As EventArgs)
LabelHistoryData.Text = CType(sender, Button).Text
ScriptManager.GetCurrent(Me).AddHistoryPoint(key, LabelHistoryData.Text, "Entry: " + LabelHistoryData.Text)
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Microsoft ASP.NET 3.5 Extensions: Managing History</title>
<link href="../../include/qsstyle.css" type="text/css" rel="Stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server" ID="ScriptManager1" OnNavigate="OnNavigateHistory"
EnableHistory="true" EnableSecureHistoryState="false" />
<h2>
Microsoft ASP.NET 3.5 Extensions: Adding Server-side Browser History Points</h2>
<p/>
<div id="Div1" class="new">
<p>This sample shows:</p>
<ol>
<li>How to use the <code>ScriptManager</code> control to set a history point.</li>
<li>The <code>ScriptManager</code> control, the <code>EnableHistory</code> and
<code>EnableSecureHistoryState</code> properties and
the <code>OnNavigate</code> property to handle the <code>navigate</code>event.<br />
</li>
</ol>
</div>
<p>
In this example, three buttons outside the <code>UpdatePanel</code> control can
trigger an asynchronous postback. You can see the results of the update through
the date and time that renders in the Web page along with a value indicating the
button that triggered the partial refresh.</p>
<p>
When you press a button, the server-side <code>Click</code> event handler for the button
stores data and uses the data as a history point. If you click the browser's Back button,
you will see the state Web page return to a previous button value, representing the previous
button you pressed. However, you will see that the time within the Web page continues to be
incremented.
</p>
<p>To see the effect of this logic, do the following.</p>
<ol>
<li>Press <b>1</b>. See the panel refresh.</li>
<li>Press <b>3</b>. See the panel refresh.</li>
<li>Press <b>2</b>. See the panel refresh.</li>
<li>Press the browser's Back button. Note that the panel is refreshed with previous
data, but the date and time are updated to current values.</li>
</ol>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button3" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Panel runat="server" CssClass="box" ID="Content" Height="40px">
Date and Time:
<%= DateTime.Now.ToLongTimeString() %>
<br />
Page's refresh state:
<asp:Label runat="server" ID="LabelHistoryData" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<p />
<asp:Button runat="server" ID="Button1" Text="Key 1" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button2" Text="Key 2" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button3" Text="Key 3" OnClick="ButtonClick" />
</div>
</form>
</body>
</html>
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Globalization" %>
<%@ Import Namespace="System.Collections.Generic" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
private static String key = "s";
// Handle the Navigate event
public void OnNavigateHistory(object sender, HistoryEventArgs e) {
LabelHistoryData.Text = Server.HtmlEncode(e.State[key]);
}
// On button click, handle the event and set a history point.
public void ButtonClick(object sender, EventArgs e) {
LabelHistoryData.Text = ((Button)sender).Text;
ScriptManager.GetCurrent(this).AddHistoryPoint(key, LabelHistoryData.Text, "Entry: " + LabelHistoryData.Text);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Microsoft ASP.NET 3.5 Extensions: Managing History</title>
<link href="../../include/qsstyle.css" type="text/css" rel="Stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server" ID="ScriptManager1" OnNavigate="OnNavigateHistory"
EnableHistory="true" EnableSecureHistoryState="false" />
<h2>
Microsoft ASP.NET 3.5 Extensions: Adding Server-side Browser History Points and Title Entries</h2>
<p/>
<div id="Div1" class="new">
<p>This sample shows:</p>
<ol>
<li>How to use the <code>ScriptManager</code> control to set a history point and add titles.</li>
<li>The <code>ScriptManager</code> control, the <code>EnableHistory</code> and
<code>EnableSecureHistoryState</code> properties and
the <code>OnNavigate</code> property to handle the <code>navigate</code>event.<br />
</li>
</ol>
</div>
<p>
In this example, three buttons outside the <code>UpdatePanel</code> control can
trigger an asynchronous postback. You can see the results of the update through
the date and time that renders in the Web page along with a value indicating the
button that triggered the partial refresh.</p>
<p>
When you press a button, the server-side <code>Click</code> event handler for the button
stores data and uses the data as a history point. If you click the browser's Back button,
you will see the state Web page return to a previous button value, representing the previous
button you pressed. However, you will see that the time within the Web page continues to be
incremented.
</p>
<p>To see the effect of this logic, do the following.</p>
<ol>
<li>Press <b>1</b>. See the panel refresh.</li>
<li>Press <b>3</b>. See the panel refresh.</li>
<li>Press <b>2</b>. See the panel refresh.</li>
<li>Press the browser's Back button. Note that the panel is refreshed with previous
data, but the date and time are updated to current values.</li>
<li>Press the browser's "Recent Pages" drop down menu and review the history entries and their titles.</li>
</ol>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Button3" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Panel runat="server" CssClass="box" ID="Content" Height="40px">
Date and Time:
<%= DateTime.Now.ToLongTimeString() %>
<br />
Page's refresh state:
<asp:Label runat="server" ID="LabelHistoryData" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<p />
<asp:Button runat="server" ID="Button1" Text="Key 1" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button2" Text="Key 2" OnClick="ButtonClick" />
<asp:Button runat="server" ID="Button3" Text="Key 3" OnClick="ButtonClick" />
</div>
</form>
</body>
</html>