jquery ui Datepicker minDate 的重新初始化失败

Posted

技术标签:

【中文标题】jquery ui Datepicker minDate 的重新初始化失败【英文标题】:jquery ui Datepicker reInitialization of minDate fails 【发布时间】:2020-01-30 23:50:06 【问题描述】:

我有一个初始化日期选择器的函数

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);
        );
    

还有一个设置 minDate 的函数,我也使用来自另一个 Datepicker 的 getDate。

    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;
    

当第二个日期选择器改变时,我会重新初始化这个日期选择器。

    $(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" ));
    );

控制台日志的结果是:

一开始我们就有(第二个日期选择器的日期为 2019-06-03):

41:1500 开始初始化关闭

41:1503 在 EndDate 上设置最小值

41:1505 Mon Jun 03 2019 00:00:00 GMT+0200(中欧夏令时间)

41:1535 最小回报:

41:1536 Mon Jun 03 2019 00:00:00 GMT+0200(中欧夏令时间)

更改第二个日期选择器后,初始化开始,我得到所有其他结果

41:1500 开始初始化关闭

41:1503 在 EndDate 上设置最小值

2018 年 12 月 7 日星期五 41:1505 00:00:00 GMT+0100(中欧标准时间)

41:1535 最小回报:

2018 年 12 月 7 日星期五 41:1536 00:00:00 GMT+0100(中欧标准时间)

41:2778 分钟结束

41:2779 2019 年 6 月 3 日星期一 00:00:00 GMT+0200(中欧夏令时间)

41:2780 mmax 结束

2018-12-27 41:2781

我预计 minDate 将是 2018-12-27,但它仍然与开始时一样。 我错过了什么导致console.log初始化计算日期的函数似乎正确返回日期。

【问题讨论】:

【参考方案1】:

只调用函数来设置最小和最大日期而不进行完全初始化可以解决问题

【讨论】:

以上是关于jquery ui Datepicker minDate 的重新初始化失败的主要内容,如果未能解决你的问题,请参考以下文章

jquery UI datepicker汉化

使用 jquery 验证和 jquery-ui datepicker

将 JQuery UI Datepicker 与来自 Jquery UI 主题的图标一起使用

jquery Ui datepicker()

jquery ui datepicker怎么设置默认日期

如何触发 jQuery UI DatePicker onclick?