How to set date2>date1 in Jquery UI Datepicker?

Question

Hi i want to select date of birth from first date picker. In second date picker pick dates only above date of birth.

http://jsfiddle.net/boopathirajan/6c3v5gna/2/

I added code here.

so help me how to pick date2>date1 only

html

<div class="wrapper">
    <input type="text" value="" id="date1" name="dob">
        <input type="text" value="" id="date2" name="vcc">
</div>

jquery

    jQuery('#date1').datepicker({
                              dateFormat : 'dd-mm-yy',
                              maxDate: 0
                              });

   jQuery('#date2').datepicker({
                              dateFormat : 'dd-mm-yy',
                              maxDate: 0
                             });

Possible Duplicate of http://stackoverflow.com/questions/833997/end-date-greater-than-start-date-jquery-validation — Yunus Aslam, Aug 29 '14 at 05:33

Yunus Aslam · Answer 1 · 2014-08-29T05:51:57.310

Here is the solution for you.

jQuery('#date1').datepicker({
    dateFormat : 'dd-mm-yy',
    onSelect: function(selected) {
          $("#date2").datepicker("option","minDate", selected)
     }
});

jQuery('#date2').datepicker({
    dateFormat : 'dd-mm-yy',
    onSelect: function(selected) {
           $("#date1").datepicker("option","maxDate", selected)
    }
 });

JSFIDLE

OR a different Approach

$(document).ready(function () {
$("#date1").datepicker({
    dateFormat: "dd-M-yy",
    minDate: 0,
    onSelect: function (date) {
        var date2 = $('#date1').datepicker('getDate');
        date2.setDate(date2.getDate() + 1);
    }
});
$('#date2').datepicker({
    dateFormat: "dd-M-yy",
    onClose: function () {
        var dt1 = $('#date1').datepicker('getDate');
        var dt2 = $('#date2').datepicker('getDate');
        //check to prevent a user from entering a date below date of dt1
        if (dt2 <= dt1) {
            var minDate = $('#date2').datepicker('option', 'minDate');
            $('#date2').datepicker('setDate', minDate);
        }
    }
});
});

thanks for your answer. i already got it. thanks for your good effort. — Boopathi Rajan, Aug 29 '14 at 05:55

score 0 · Accepted Answer · answered Aug 29 '14 at 05:52

Its working fine

jQuery('#date1').datepicker({
        dateFormat : 'dd-mm-yy',
        maxDate: 0,
        onSelect: function (date) {
            $('#date2').datepicker('option', 'minDate', date);
               }
            });

jQuery('#date2').datepicker({
        dateFormat : 'dd-mm-yy',
        maxDate:0,
        minDate:1,
      });

DEMO

How to set date2>date1 in Jquery UI Datepicker?

2 Answers2