UpdatePanel4CS.aspx 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195
  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 ChosenDate_TextChanged(object sender, EventArgs e)
  6. {
  7. DateTime dt = new DateTime();
  8. DateTime.TryParse(ChosenDate.Text, out dt);
  9. CalendarPicker.SelectedDate = dt;
  10. CalendarPicker.VisibleDate = dt;
  11. }
  12. protected void Close_Click(object sender, EventArgs e)
  13. {
  14. SetDateSelectionAndVisible();
  15. }
  16. protected void ShowDatePickerPopOut_Click(object sender, ImageClickEventArgs e)
  17. {
  18. DatePickerPopOut.Visible = !DatePickerPopOut.Visible;
  19. }
  20. protected void CalendarPicker_SelectionChanged(object sender, EventArgs e)
  21. {
  22. SetDateSelectionAndVisible();
  23. }
  24. private void SetDateSelectionAndVisible()
  25. {
  26. if (CalendarPicker.SelectedDates.Count != 0)
  27. ChosenDate.Text = CalendarPicker.SelectedDate.ToShortDateString();
  28. DatePickerPopOut.Visible = false;
  29. }
  30. protected void SubmitButton_Click(object sender, EventArgs e)
  31. {
  32. if (Page.IsValid)
  33. {
  34. MessageLabel.Text = "An email with availability was sent.";
  35. }
  36. else
  37. {
  38. MessageLabel.Text = "";
  39. }
  40. }
  41. protected void Page_Load(object sender, EventArgs e)
  42. {
  43. CompareValidatorDate.ValueToCompare = DateTime.Today.ToShortDateString();
  44. ExtraShow1.Text = DateTime.Today.AddDays(10.0).ToShortDateString();
  45. ExtraShow2.Text = DateTime.Today.AddDays(11.0).ToShortDateString();
  46. }
  47. protected void ExtraShow_Click(object sender, EventArgs e)
  48. {
  49. ChosenDate.Text = ((LinkButton)sender).Text;
  50. }
  51. </script>
  52. <html xmlns="http://www.w3.org/1999/xhtml">
  53. <head id="Head1" runat="server">
  54. <title>Calendar Popup Example</title>
  55. <style type="text/css">
  56. body {
  57. font-family: Tahoma;
  58. }
  59. .PopUpCalendarStyle
  60. {
  61. background-color:lightblue;
  62. position:absolute;
  63. visibility:show;
  64. margin: 15px 0px 0px 10px;
  65. z-index:99;
  66. border: solid 2px black;
  67. }
  68. .UpdatePanelContainer
  69. {
  70. width: 260px;
  71. height:110px;
  72. }
  73. </style>
  74. </head>
  75. <body>
  76. <form id="form1" runat="server">
  77. <asp:ScriptManager ID="ScriptManager1" runat="server" />
  78. <script type="text/javascript">
  79. Type.registerNamespace("ScriptLibrary");
  80. ScriptLibrary.BorderAnimation = function(color, duration) {
  81. this._color = color;
  82. this._duration = duration;
  83. }
  84. ScriptLibrary.BorderAnimation.prototype = {
  85. animatePanel: function(panelElement) {
  86. var s = panelElement.style;
  87. s.borderWidth = '1px';
  88. s.borderColor = this._color;
  89. s.borderStyle = 'solid';
  90. window.setTimeout(
  91. function() {{ s.borderWidth = 0; }},
  92. this._duration
  93. );
  94. }
  95. }
  96. ScriptLibrary.BorderAnimation.registerClass('ScriptLibrary.BorderAnimation', null);
  97. var panelUpdatedAnimation = new ScriptLibrary.BorderAnimation('blue', 1000);
  98. var postbackElement;
  99. Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginRequest);
  100. Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);
  101. function beginRequest(sender, args) {
  102. postbackElement = args.get_postBackElement();
  103. }
  104. function pageLoaded(sender, args) {
  105. var updatedPanels = args.get_panelsUpdated();
  106. if (typeof(postbackElement) === "undefined") {
  107. return;
  108. }
  109. else if (postbackElement.id.toLowerCase().indexOf('extrashow') > -1) {
  110. for (i=0; i < updatedPanels.length; i++) {
  111. panelUpdatedAnimation.animatePanel(updatedPanels[i]);
  112. }
  113. }
  114. }
  115. </script>
  116. <h1>Tickets</h1>
  117. <p>
  118. <strong>Latest News</strong> Due to overwhelming response, we
  119. have added two extra shows on:
  120. <asp:LinkButton ID="ExtraShow1" runat="server" OnClick="ExtraShow_Click" />
  121. and
  122. <asp:LinkButton ID="ExtraShow2" runat="server" OnClick="ExtraShow_Click" />.
  123. Don't forget curtain time is at 7:00pm sharp. No late arrivals.
  124. </p>
  125. <hr />
  126. <div class="UpdatePanelContainer">
  127. <asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional">
  128. <Triggers>
  129. <asp:AsyncPostBackTrigger ControlID="ExtraShow1" />
  130. <asp:AsyncPostBackTrigger ControlID="ExtraShow2" />
  131. </Triggers>
  132. <ContentTemplate>
  133. <fieldset>
  134. <legend>Check Ticket Availability</legend>Date
  135. <asp:TextBox runat="server" ID="ChosenDate" OnTextChanged="ChosenDate_TextChanged" />
  136. <asp:ImageButton runat="server" ID="ShowDatePickerPopOut" OnClick="ShowDatePickerPopOut_Click"
  137. ImageUrl="../images/calendar.gif" AlternateText="Choose a date."
  138. Height="20px" Width="20px" />
  139. <asp:Panel ID="DatePickerPopOut" CssClass="PopUpCalendarStyle"
  140. Visible="false" runat="server">
  141. <asp:Calendar ID="CalendarPicker" runat="server" OnSelectionChanged="CalendarPicker_SelectionChanged">
  142. </asp:Calendar>
  143. <br />
  144. <asp:LinkButton ID="CloseDatePickerPopOut" runat="server" Font-Size="small"
  145. OnClick="Close_Click" ToolTip="Close Pop out">
  146. Close
  147. </asp:LinkButton>
  148. </asp:Panel>
  149. <br />
  150. Email
  151. <asp:TextBox runat="server" ID="EmailTextBox" />
  152. <br />
  153. <br />
  154. <asp:Button ID="SubmitButton" Text="Check" runat="server" ValidationGroup="RequiredFields"
  155. OnClick="SubmitButton_Click" />
  156. <br />
  157. <asp:CompareValidator ID="CompareValidatorDate" runat="server"
  158. ControlToValidate="ChosenDate" ErrorMessage="Choose a date in the future."
  159. Operator="GreaterThanEqual" Type="Date" Display="None" ValidationGroup="RequiredFields" EnableClientScript="False"></asp:CompareValidator>
  160. <asp:RequiredFieldValidator ID="RequiredFieldValidatorDate" runat="server"
  161. ControlToValidate="ChosenDate" Display="None" ErrorMessage="Date is required."
  162. ValidationGroup="RequiredFields" EnableClientScript="False"></asp:RequiredFieldValidator>
  163. <asp:RegularExpressionValidator ID="RegularExpressionValidatorEmail"
  164. runat="server" ControlToValidate="EmailTextBox" Display="None"
  165. ValidationGroup="RequiredFields" ErrorMessage="The email was not correctly formatted."
  166. ValidationExpression="^([0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*@([0-9a-zA-Z][-\w]*[0-9a-zA-Z]\.)+[a-zA-Z]{2,9})$" EnableClientScript="False"></asp:RegularExpressionValidator>
  167. <asp:RequiredFieldValidator ID="RequiredFieldValidatorEmail"
  168. runat="server" ValidationGroup="RequiredFields" ControlToValidate="EmailTextBox"
  169. Display="None" ErrorMessage="Email is required." EnableClientScript="False"></asp:RequiredFieldValidator><br />
  170. <asp:ValidationSummary ID="ValidationSummary1" runat="server"
  171. ValidationGroup="RequiredFields" EnableClientScript="False" />
  172. <asp:Label ID="MessageLabel" runat="server" />
  173. </fieldset>
  174. </ContentTemplate>
  175. </asp:UpdatePanel>
  176. </div>
  177. </form>
  178. </body>
  179. </html>