How to validate start and end date in jquery datepicker without day.?

Question

I have two datepickers which select only month and year. I need to validate this two datepickers. If I select a month and year from onedatepicker (starDate), say Feb 2017 and all the before dates (like Jan 2017, Dec 2016, Nov 2016 and so on..) should be disabled in seconddatepicker (endDate). I have set a minValue but doesn't work.

Here is my fiddle

<p>Start Date 1: <input type="text" id="startDate"></p>
<p>End Date 1: <input type="text" id="endDate"></p>

<script>
  $("#startDate").datepicker({
        changeMonth: true,
        changeYear: true,
        beforeShowDay: function (date) {
            return [''];
        },
        showButtonPanel: true,
        dateFormat: 'MM yy',
        onClose: function (dateText, inst) {
                var minValue = $(this).val();
            jQuery(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
            $("#endDate").datepicker({
              changeMonth: true,
              changeYear: true,
              beforeShowDay: function (date) {
                  return [''];
              },
              showButtonPanel: true,
              dateFormat: 'MM yy',
              minValue:minValue,
              onClose: function (dateText, inst) {
                  jQuery(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
              },
          });
        },
    });

<script>

Thanks. :)

Duplicate: http://stackoverflow.com/questions/3827425/jquery-ui-datepicker-range — deepakssn, Jan 10 '17 at 05:57

score 1 · Answer 1 · answered Jan 10 '17 at 08:54

Got my answer. :)

fiddle : https://jsfiddle.net/n1gzbkru/2/

$("#startDate").datepicker({
        changeMonth: true,
        changeYear: true,
        beforeShowDay: function (date) {
            return [''];
        },
        showButtonPanel: true,
        dateFormat: 'MM yy',
        onClose: function (dateText,inst) {
            $(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
            var month = inst.selectedMonth;
            console.log(month);
            $("#endDate").datepicker({
                changeMonth: true,
                changeYear: true,
                minDate:"+"+(month+1)+"m",
                beforeShowDay: function (date) {
                    return [''];
                },
                showButtonPanel: true,
                dateFormat: 'MM yy',
                onClose: function (dateText,inst) {
                    jQuery(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
                },
            });
        },
    });

How to validate start and end date in jquery datepicker without day.?

1 Answers1