jquery ui Datepicker reInitialization of minDate fails

Question

i have a function that initializes a datepicker

function initDatepickerTaskEndDate(){
            //console.log(new Date(studyPhaseTimeframe.endDate));
        $(".closeTaskDatePicker").datepicker({
            showOn: "both",
            showOtherMonths: true,
            selectOtherMonths: true,
            changeMonth: true,
            changeYear: true,
            dateFormat: "yy-mm-dd",
            showWeek: true,
            firstDay: 1,
            showButtonPanel: true,
            minDate: setMinDateForTaskCloseDatePicker(),
            maxDate: studyPhaseTimeframe.endDate,
            onClose: function (){// setting end date and link to call the save function
                        var closeDate = $(".closeTaskDatePicker").datepicker("getDate");
                        if(closeDate!=null){
                            $(".acceptCloseDate").prop("disabled",false);
                        }
                    },
        }).focus(function(){
            $(".ui-datepicker-calendar").css({"position":"relative"});  
            $(this).attr("autocomplete","off");
            $(".acceptCloseDate").prop("disabled",true);
        });
    }

And a function to set minDate where i also use getDate from another Datepicker.

    function setMinDateForTaskCloseDatePicker(){
        var minDate=null;
        console.log("start init close")
        //set min Date to Task Close date to the biggest milestone completed date or to the biggest task schedule completion date.
        //console.log($(".datepickerTaskStart").datepicker("getDate"));
        console.log("set min on EndDate");
        minDate=$(".datepickerTaskStart").datepicker("getDate");    
        console.log(minDate);           
        if(taskSchedulesListLength>0){
            $.each(taskSchedulesList,function(index,item){
                if(item.plannedDate!=null){
                    var newDate=new Date(item.plannedDate);
                    if(minDate==null && item.completedQty>0){
                        minDate=newDate;
                    }else if(minDate<newDate && item.completedQty>0){
                        console.log("came in");
                        minDate=newDate;
                    }
                }
            });
        }else{
            $.each(milestoneRoleBudgetList,function(index,item){
                if(item.completionDate!=null){
                    var newDate=new Date(item.completionDate);
                    if(minDate==null){
                        minDate=newDate;
                    }else if(minDate<newDate){
                        minDate=newDate;
                    }
                }
            });
        }
                
        console.log("Min Return:");
        console.log(minDate);
        return minDate;
    }

Also when the second datepicker changes i re-initialize this datepickers.

    $(document).on('change','.datepickerTaskStart',function(){
        initDatepickerTaskEndDate();
        console.log("mminn end");
        console.log($(".closeTaskDatePicker").datepicker( "option", "minDate" ));
        console.log("mmaxx end");
        console.log($(".closeTaskDatePicker").datepicker( "option", "maxDate" ));
    });

The result of console log is :

On start we have (where second datepicker has date of 2019-06-03):

41:1500 start init close

41:1503 set min on EndDate

41:1505 Mon Jun 03 2019 00:00:00 GMT+0200 (Central European Summer Time)

41:1535 Min Return:

41:1536 Mon Jun 03 2019 00:00:00 GMT+0200 (Central European Summer Time)

After changing the second datepicker, initialization starts and i have all other results

41:1500 start init close

41:1503 set min on EndDate

41:1505 Fri Dec 07 2018 00:00:00 GMT+0100 (Central European Standard Time)

41:1535 Min Return:

41:1536 Fri Dec 07 2018 00:00:00 GMT+0100 (Central European Standard Time)

41:2778 mminn end

41:2779 Mon Jun 03 2019 00:00:00 GMT+0200 (Central European Summer Time)

41:2780 mmaxx end

41:2781 2018-12-27

I am expecting the minDate to be 2018-12-27 but it remains as it was at the beginning. What do i miss cause console.log in initialization the function that calculates the date seems to return the date correctly.

kyrpav kyrpav · Accepted Answer · 2019-10-07T11:20:53

Calling only function to set min and max dates without total initialization fixes the problem

jquery ui Datepicker reInitialization of minDate fails

1 Answers