TwoPanelsProgress.aspx 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. <%@ Page Language="C#" %>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <script runat="server">
  5. protected void Button1_Click(object sender, EventArgs e)
  6. {
  7. System.Threading.Thread.Sleep(4000);
  8. Label1.Text = "Last update from server " + DateTime.Now.ToString();
  9. }
  10. protected void Button2_Click(object sender, EventArgs e)
  11. {
  12. System.Threading.Thread.Sleep(1000);
  13. Label2.Text = "Last update from server " + DateTime.Now.ToString();
  14. }
  15. </script>
  16. <html xmlns="http://www.w3.org/1999/xhtml">
  17. <head id="Head1" runat="server">
  18. <title>Postback Precedence Example</title>
  19. <style type="text/css">
  20. body {
  21. font-family: Tahoma;
  22. }
  23. #UpdatePanel1, #UpdatePanel2 {
  24. width: 400px;
  25. height: 100px;
  26. border: solid 1px gray;
  27. }
  28. div.MessageStyle {
  29. background-color: #FFC080;
  30. top: 95%;
  31. left: 1%;
  32. height: 20px;
  33. width: 600px;
  34. position: absolute;
  35. visibility: hidden;
  36. }
  37. </style>
  38. </head>
  39. <body>
  40. <form id="form1" runat="server">
  41. <div>
  42. <span id="span1">Not Initialized</span>
  43. <asp:ScriptManager ID="ScriptManager1" runat="server">
  44. <Scripts>
  45. <asp:ScriptReference Path="PostBackPrecedence.js" />
  46. </Scripts>
  47. </asp:ScriptManager>
  48. <asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="Server" >
  49. <ContentTemplate>
  50. <strong>UpdatePanel 1</strong><br />
  51. This postback takes precedence.<br />
  52. <asp:Label ID="Label1" runat="server">Panel initially rendered.</asp:Label><br />
  53. <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />&nbsp;
  54. <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
  55. <ProgressTemplate>
  56. Panel1 updating...
  57. </ProgressTemplate>
  58. </asp:UpdateProgress>
  59. </ContentTemplate>
  60. </asp:UpdatePanel>
  61. <asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="Server" >
  62. <ContentTemplate>
  63. <strong>UpdatePanel 2</strong><br />
  64. <asp:Label ID="Label2" runat="server">Panel initially rendered.</asp:Label><br />
  65. <asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button2_Click" />
  66. <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
  67. <ProgressTemplate>
  68. Panel2 updating...
  69. </ProgressTemplate>
  70. </asp:UpdateProgress>
  71. </ContentTemplate>
  72. </asp:UpdatePanel>
  73. <div id="AlertDiv" class="MessageStyle">
  74. <span id="AlertMessage"></span>
  75. </div>
  76. </div>
  77. <script language="javascript" type="text/javascript">
  78. Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);
  79. var p1UpdateCount = 1;
  80. var p2UpdateCount = 1;
  81. function pageLoaded(sender, args)
  82. {
  83. var updatedPanels = args.get_panelsUpdated();
  84. for (i=0; i < updatedPanels.length; i++) {
  85. if (updatedPanels[i].id == "UpdatePanel1"){
  86. p1UpdateCount++;
  87. } else if (updatedPanels[i].id == "UpdatePanel2"){
  88. p2UpdateCount++;
  89. }
  90. }
  91. UpdateSpan1();
  92. }
  93. function UpdateSpan1()
  94. {
  95. document.getElementById("span1").innerHTML = "Panel1: " + p1UpdateCount + ", Panel2: " + p2UpdateCount;
  96. }
  97. </script>
  98. </form>
  99. </body>
  100. </html>