Date Comparisons using Javascript 15th June 2019

In this blog we will see how we can create date object using Bootstrap Datepicker.First, we will create "Date object" from 'Date' and 'Time' string values.Now that we have dates to compare, we will see various ways to compare Dates and figure out if a particular date is greater,equal or less than the other date. In the process, we will also learn how to validate date and time using regex in Javascript

What we will achieve at the end of this blog

We will learn how to create Date objects in Javascript and also how to compare them.Let's not forget there may be multiple ways to do that apart from the one shown in the eg source code.

Our Use Case

Let’s assume you are developing a website where in the users need to key in start date, start time, end date and end time.Best eg for this may be some holiday/vacation planning website.So lets assume this website caters needs based on the user's vacation start/end date and start/end time.User Enters the date and time and based on the details entered "Get availability" is enabled

Below is a quick demo to wrap your head around to what we are trying to achieve Solution:
Source Code-Link to github.
Lets quickly go through some requirements

• If Vacation Start Date is entered and valid, enable Vacation Start Time,Vacation End Date and Vacation End Time
• If Vacation Start Date and Vacation Start Time is entered and valid, enable Vacation End Date and Vacation End Time
• If Vacation Start Date,Vacation Start Time and Vacation End Date is entered and valid, enable Vacation End Time
• Enable "Get Availablity" only if everything entered and valid

Dependencies checklist
• jQuery Link to download
• jQuery UI Link to download
• Bootstrap Datepicker Link to download
• Bootstrap datepicker CSS Link to download
• Bootstrap 3.3.4 jsLink to download
• Bootstrap 3.3.4 cssLink to download