Abstraction
Many beginners and sometimes experienced developers also encounter the question of how to compare two dates. In this article I have described this difference and explained everything that will help a beginner. If this has some drawback or if you have some suggestion, then feel free to mention it in the comments section. Today a friend told me that he encountered the same question in an interview during a machine test process.
Initial chamber
Step 1
Open Visual Studio and create an empty website, provide a suitable name such as DateCompare.
Step 2
In Solution Explorer you will get your empty website, then add web forms
For Web Form
DateCompare (your empty website). Right-click and select Add New Item, then Web Form. Name it DateCompare.aspx.
Design chamber
Step 3
Open the DateCompare.aspx file and write some code for the design of the application.
First add a jQuery plugin to your head section. Here I used jquery-1.9.1.js for demonstration purposes.
The following shows how to add it to your page:
- <div>
- <div>
- <table border="0" cellpadding="0" cellspacing="0">
- <tr>
- <th>First Date
- </th>
- <th>Second Date
- </th>
- </tr>
- <tr>
- <td>
- <asp:TextBox ID="txtDate1" runat="server" />
- </td>
- <td>
- <asp:TextBox ID="txtDate2" runat="server" />
- </td>
- <td>
- <asp:Button ID="btnDiff" runat="server" OnClick="btnDiff_Click" Text="Calculate Date" />
- </td>
- </tr>
-
- </table>
-
- </div>
- </div>
Now the design looks as in the following:
![design]()
Now write some script for jQuery. Here we will write code to show and hide jQuery code:
- <script>
- $(document).ready(
-
-
- function () {
- $("#txtDate1").datepicker({
- changeMonth: true,
- changeYear: true
- });
- $("#txtDate2").datepicker({
- changeMonth: true,
- changeYear: true
- });
- }
-
- );
- </script>
Add some CSS for the look and feel in the head section of the page:
- <style type="text/css">
- body {
- color: #333;
- text-align: center;
- background-color: aqua;
- }
- </style>
Now your page looks like the following:
DateCompare.aspx
- <%@ Page Language="C#" AutoEventWireup="true" CodeFile="DateCompare.aspx.cs" Inherits="DateCompare" %>
-
- <!DOCTYPE html>
-
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head runat="server">
- <title>C# corner article for date comparision</title>
- <!-- Load jQuery from Google's CDN -->
- <!-- Load jQuery UI CSS -->
- <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
-
- <!-- Load jQuery JS -->
- <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
- <!-- Load jQuery UI Main JS -->
- <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
-
- <!-- Load SCRIPT.JS which will create datepicker for input field -->
- <script>
- $(document).ready(
-
-
- function () {
- $("#txtDate1").datepicker({
- changeMonth: true,
- changeYear: true
- });
- $("#txtDate2").datepicker({
- changeMonth: true,
- changeYear: true
- });
- }
-
- );
- </script>
- <style type="text/css">
- body {
- color: #333;
- text-align: center;
- background-color: aqua;
- }
- </style>
- </head>
- <body>
- <form id="form1" runat="server">
- <div>
- <div>
- <table border="0" cellpadding="0" cellspacing="0">
- <tr>
- <th>First Date
- </th>
- <th>Second Date
- </th>
- </tr>
- <tr>
- <td>
- <asp:TextBox ID="txtDate1" runat="server" />
- </td>
- <td>
- <asp:TextBox ID="txtDate2" runat="server" />
- </td>
- <td>
- <asp:Button ID="btnDiff" runat="server" OnClick="btnDiff_Click" Text="Calculate Date" />
- </td>
- </tr>
-
- </table>
-
- </div>
- </div>
- </form>
- </body>
- </html>
On code behind page.
I have written some code for date comparison using C#.
DateCompare.aspx.cs
- using System;
- using System.Collections.Generic;
- using System.Linq;
- using System.Web;
- using System.Web.UI;
- using System.Web.UI.WebControls;
-
- public partial class DateCompare : System.Web.UI.Page
- {
- protected void Page_Load(object sender, EventArgs e)
- {
-
- }
-
- protected void CompareDate()
- {
- if (txtDate1.Text == "" && txtDate2.Text == "")
- {
- ClientScript.RegisterStartupScript(this.GetType(), "Alert", "alert('Textbox can not be blank!')", true);
- return;
- }
- else if (txtDate1.Text == "" || txtDate2.Text == "")
- {
- ClientScript.RegisterStartupScript(this.GetType(), "Alert", "alert('Date must be select for comparision')", true);
- return;
- }
- else
- {
-
- string date1Day = this.txtDate1.Text.Remove(2);
- string date2Day = this.txtDate2.Text.Remove(2);
-
- string date1Month = this.txtDate1.Text.Substring(3, 2);
- string date2Month = this.txtDate2.Text.Substring(3, 2);
-
- string date1Year = this.txtDate1.Text.Substring(6);
- string date2Year = this.txtDate2.Text.Substring(6);
-
- DateTime d1 = Convert.ToDateTime(date1Month + "/" + date1Day + "/" + date1Year);
- DateTime d2 = Convert.ToDateTime(date2Month + "/" + date2Day + "/" + date2Year);
- if (d1 > d2)
- {
- ClientScript.RegisterStartupScript(this.GetType(), "Alert", "alert('First dae is greater')", true);
- }
- else if (d1 == d2)
- {
- ClientScript.RegisterStartupScript(this.GetType(), "Alert", "alert('Both date are same')", true);
- }
- else
- {
- ClientScript.RegisterStartupScript(this.GetType(), "Alert", "alert('Second date is greater')", true);
- }
- }
- }
- protected void btnDiff_Click(object sender, EventArgs e)
- {
- CompareDate();
- }
- }
Output
Figure 1: Initial loading
Figure 2: On first text box
Figure 3: On second TextBox click
Figure 4: On button click when TextBox is blank
Figure 5: When one TextBox is blank
![enter date]()
Figure: 6a
![Compare date]()
Figure: 6b
![date]()
Figure: 6c
Figure 6: When getting positive output
I hope you liked this. Have a good day. Thank you for reading.