I'm working with code from a supplier who created the shell of a working website. I need to add a date range to one of the reports.
The web site has a Master Page (ASP.NET)where it uses the form tag that begins and ends on the Master Page.
The page where I want to add two date fields is started and ended with <asp:Content></asp:Content>. The fields for the two dates work on a separate aspx page where I can use the form tag and there is no <asp:Content> section. That exact code does not work between the <asp:Content> and </asp:Content> tags in the web site code.
Here is my separate calendar.aspx. This code does not work between <asp:Content> tags and a Master Page already have a form tag which causes VS 2010 c# to disallow the one in this code.
- <!doctype html>
- <html lang="en">
- <head>
- <title>jQuery UI Datepicker - Display month & year menus</title>
- <link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css"/>
- <script src="//code.jquery.com/jquery-1.10.2.js"></script>
- <script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
- <link rel="stylesheet" href="/resources/demos/style.css" />
- <script>
- $(function() {
- $("#SearchFromdateTextBox").datepicker({
- changeMonth: true,
- changeYear: true
- });
- });
- $(function() {
- $("#SearchToDateTextBox").datepicker({
- changeMonth: true,
- changeYear: true
- });
- });
- function isDateCheck(txta) {
- var dateString = document.getElementById(txta).value;
- // First check for the pattern
- if (!/^\d{1,2}\/\d{1,2}\/\d{4}$/.test(dateString))
- return false;
- // Parse the date parts to integers
- var parts = dateString.split("/");
- var day = parseInt(parts[1], 10);
- var month = parseInt(parts[0], 10);
- var year = parseInt(parts[2], 10);
- // Check the ranges of month and year
- if (year < 1000 || year > 3000 || month == 0 || month > 12)
- return false;
- var monthLength = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
- // Adjust for leap years
- if (year % 400 == 0 || (year % 100 != 0 && year % 4 == 0))
- monthLength[1] = 29;
- // Check the range of the day
- return day > 0 && day <= monthLength[month - 1];
- }
- function checkdatepicker(){
- if (!isDateCheck("SearchFromdateTextBox")) {
- document.getElementById("SearchFromdateTextBox").style.backgroundColor = "yellow";
- document.getElementById("SearchFromdateTextBox").focus();
- return false;
- } else {
- document.getElementById("SearchFromdateTextBox").style.backgroundColor = "white";
- return true;
- }
- }
- function checkdatepicker1() {
- if (!isDateCheck("SearchToDateTextBox")) {
- document.getElementById("SearchToDateTextBox").style.backgroundColor = "yellow";
- document.getElementById("SearchToDateTextBox").focus();
- return false;
- } else {
- document.getElementById("SearchToDateTextBox").style.backgroundColor = "white";
- return true;
- }
- }
- function compareDate() {
- var start = document.getElementById("SearchFromdateTextBox").value;
- var end = document.getElementById("SearchToDateTextBox").value;
- var curdate = new Date();
- var stDate = new Date(start);
- var enDate = new Date(end);
- var compDate = enDate - stDate;
- if (compDate >= 0 && enDate <= curdate) {
- return true;
- } else {
- alert("The 'To date' must be greater than or equal to the 'From date' and less than or equal to the system date. Please correct the 'To date'.");
- //document.getElementById("datepicker1").value = "";
- document.getElementById("datepicker1").focus();
- return false;
- }
- }
- </script>
- </head>
- <body>
- <form runat="server">
- <table runat="server" id="JQDateTable" visible="true">
- <tr><td colspan="4"><h1 align="center">Transactions by date</h1></td></tr>
- <tr class="maxWidth">
- <td>
- <asp:Label runat="server" ID="SearchFromdateLabel" Text="From date :" CssClass="labelClass"></asp:Label>
- </td>
- <td>
- <asp:TextBox ID="SearchFromdateTextBox" runat="server" CssClass="Report-text-box"></asp:TextBox>
- </td>
- <td>
- <asp:Label runat="server" ID="SearchToDateLabel" Text="To date :" CssClass="labelClass"></asp:Label>
- </td>
- <td>
- <asp:TextBox ID="SearchToDateTextBox" runat="server" onfocus="checkdatepicker()" CssClass="Report-text-box"></asp:TextBox>
- </td>
- <td>
- <asp:Button ID="SearchButton" runat="server" CssClass="btn-Report" Text="Search" onfocus="checkdatepicker1()" />
- </td>
- <td>
- <asp:Button ID="CancelButton" runat="server" CssClass="btn-Report" Text="Cancel" />
- </td>
- </tr>
- <%-- <tr class="maxWidth">
- <td>
- From date: <input type="text" id="datepicker" />
- </td>
- <td>
- To date: <input type="text" id="datepicker1" onfocus="checkdatepicker()"/>
- </td>
- <td>
- <input type="button" id="SearchButton" class="btn-Report" value="Search" onfocus="checkdatepicker1()" onclick="compareDate()" />
- </td>
- <td>
- <input type="button" id="CancelButton" class="btn-Report" value="Cancel" onclick="compareDate()" />
- </td>
- </tr>OnClick="SearchButton_Click()" onclick="return compareDate();"OnClick="CancelButton_Click()"
- </table>
- </form>
- </body>
- </html>
- Bob