Hi,
My problem happens when user leaves my page and then
he/she want to go back using the “Back” button in browser. Since I want to save
some data in page’s hiddenfield during the async postback so that I can
dynamically reconstruct the DOM when user come back. The problem is FireFox can
not keep the hiddenfield’s value if user modified the DOM before he/she leave
the page(of course, IE can).
You can run the following code in a single page
WebForm with Microsoft AJAX enabled.
Can you help me to work around on FireFox?
Thanks,
1 <%@ Page Language="C#" %>
2
3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5 <script runat="server">
6 protected void Button1_Click(object sender, EventArgs e)
7 {
8 if (ScriptManager1.IsInAsyncPostBack)
9 {
10 ScriptManager1.RegisterDataItem(HiddenField1, "HereIAm");
11 }
12 }
13 </script>
14
15 <html xmlns="http://www.w3.org/1999/xhtml" >
16 <head runat="server">
17 <title>Can not keep state in FireFox after navigate back in browser.</title>
18 </head>
19 <body onload="pageLoader()">
20 <form id="form1" runat="server">
21 <div>
22 <asp:ScriptManager ID="ScriptManager1" runat="server">
23 </asp:ScriptManager>
24
25 <script type="text/javascript">
26
27 // add handler for pageloading event for async call
28 Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(PageLoadingHandler);
29
30 // pageloading event handler
31 function PageLoadingHandler(sender, args)
32 {
33 var dataItems = args.get_dataItems();
34 if ($get('HiddenField1') !== null)
35 {
36 $get('HiddenField1').value = dataItems['HiddenField1'];
37 }
38 alert('Async get HiddenField1.Value= ' + $get('HiddenField1').value);
39 }
40
41 function pageLoader()
42 {
43 alert('onLoad: HiddenField1.Value = ' + $get('HiddenField1').value);
44 }
45
46 // When this event fire, we add some new element into the DOM.
47 // After I get the hiddenfield's state, I leave current page to somewhere
48 // and then come back using 'Back' button of browser.
49 // FireFox will not keep the hiddenfield's value but IE can. Why???
50 function inputClick()
51 {
52 var divDynamic = $get('dynamicArea');
53 var table = document.createElement("table");
54 var row = document.createElement("tr");
55 var col = document.createElement("td");
56
57 var inputSL = document.createElement("input");
58 inputSL.type = "text";
59 inputSL.id = 'dyn1';
60 inputSL.value = 'A';
61
62 col.appendChild(inputSL);
63 row.appendChild(col);
64 table.appendChild(row);
65
66 if(document.all)
67 {
68 divDynamic.innerHTML = table.outerHTML;
69 }
70 else
71 {
72 divDynamic.appendChild(table);
73 }
74 }
75 </script>
76
77 <input id="input1" type="button" value="Add a textbox." onclick="inputClick()" />
78 <div id='dynamicArea'></div>
79 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
80 <ContentTemplate>
81 <asp:Button ID="Button1" Text="Get HiddenField state." runat="server" OnClick="Button1_Click" /> <br />
82 </ContentTemplate>
83 </asp:UpdatePanel>
84 <asp:HiddenField ID="HiddenField1" runat="server" />
85 <a href="http://ajax.asp.net">Leave this page. Then go back using browser's BACK button.</a>
86 </div>
87 </form>
88 </body>
89 </html>
90