Months are moving automatically after selecting 2 Dates in multiDate Picker

345 Views Asked by At

I am using multidate picker calendar of jQuery. Its working fine but after selecting tow dates of previous months its automatically moving to the current months view.

I am giving the code below which I used for my page.

$(document).ready(function() {
  $('#datePick').multiDatesPicker({
    numberOfMonths: 2,
    minDate: new Date(2018, 9, 1),
    maxDate: new Date()
  });
});
<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="https://cdn.rawgit.com/dubrox/Multiple-Dates-Picker-for-jQuery-UI/master/jquery-ui.multidatespicker.js"></script>

<input id="datePick" type="text" />

See Fiddle----> http://jsfiddle.net/jdfou32n/2/

I wants to select date from month October to current date, I can select number of dates. But when I am selecting 2 dates of previous month like 2jan and 3 jan after that it automatically moving to April and May months. I wants to remain on that month until I didn't move it by arrow.

What is the problem is I am missing some js file?

1

There are 1 best solutions below

0
The Khaleesi On

This worked for me.

<script type="text/javascript">
 $(document).ready(function(){
        $('#captureDateRange').multiDatesPicker({
            numberOfMonths: 2,
            minDate : new Date(2018, 9, 1),
            maxDate : new Date()
        });

    $.datepicker._selectDateOverload = $.datepicker._selectDate;
    $.datepicker._selectDate = function (id, dateStr) {
        var target = $(id);
        var inst = this._getInst(target[0]);
        inst.inline = true;
        $.datepicker._selectDateOverload(id, dateStr);
        inst.inline = false;
        if (target[0].multiDatesPicker != null) {
            target[0].multiDatesPicker.changed = false;
        } else {
            target.multiDatesPicker.changed = false;
        }
             this._updateDatepicker(inst);

    };
});

</script>