How to compare two dates using jQuery

Question

I am using Jquery datepicker which provides me with a texbox and calendar icon.I have two texboxes : 1 is start date and other is enddate.I need to check that end date should not be less than start date using jquery.

Answer 1

The jQuery date plugin returns date objects (see the getDate method), which are easily comparable. See this question for example.

Answer 2

First turn the dates with $.datepicker.parseDate(format, string) to Javascript date. Then use < and > for compare..

Answer 3

Based on official jQuery UI, the easiest way is to use its date range feature:

<script>
    $(function() {
        var dates = $( "#from, #to" ).datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 3,
            onSelect: function( selectedDate ) {
                var option = this.id == "from" ? "minDate" : "maxDate",
                    instance = $( this ).data( "datepicker" ),
                    date = $.datepicker.parseDate(
                        instance.settings.dateFormat ||
                        $.datepicker._defaults.dateFormat,
                        selectedDate, instance.settings );
                dates.not( this ).datepicker( "option", option, date );
            }
        });
    });
    </script>

In your markup:

<div class="demo">

<label for="from">From</label>
<input type="text" id="from" name="from"/>
<label for="to">to</label>
<input type="text" id="to" name="to"/>

</div><!-- End demo -->