如何动态设置 bootstrap-datepicker 的日期值? [英] How to dynamically set bootstrap-datepicker's date value?

问题描述

我正在使用 bootstrap datepicker 和 line highchart.

我希望日期选择器日期在图表缩放时更新.一旦该事件触发，我就会更新日期选择器的值.值更新正常，但当点击日历时，弹出日历上的日期仍然是旧日期.

这是我的日期选择器:

<div class="input-append date pull-right" id="dpStartDate" data-date="@DateTime.Now.AddMonths(-1).ToString("dd/MM/yyyy")" 数据日期格式="dd/mm/yyyy"><input class="span2" id="startDateText" size="16" type="text" value="@DateTime.Now.AddMonths(-1).ToString("dd/MM/yyyy")" readonly=""><span class="add-on"><i class="icon-th"></i></span>

我尝试使用此代码更新值:

$('#dpStartDate').attr('data-date', startDate);$('#startDateText').attr('value', startDate);

它可以很好地更新日期但没有设置日历.

我也尝试触发 onChange 事件，它也更新日期但不更新日历:

$('#dpStartDate').trigger('changeDate', startDate);$('#dpStartDate').datepicker().on('show', 函数 (ev) {ev.stopPropagation();}).on('changeDate', function (ev, date) {var startDate = new Date();如果(日期！=未定义){开始日期 = 日期；$('#dpStartDate').attr('data-date', startDate);$('#startDateText').attr('value', startDate);}别的 {开始日期 = ev.date;$('#dpStartDate').attr(startDate.getDate() + '/' + (startDate.getMonth() + 1) + '/' + startDate.getFullYear());$('#startDateText').attr(startDate.getDate() + '/' + (startDate.getMonth() + 1) + '/' + startDate.getFullYear());}$('#dpStartDate').datepicker('hide');ev.stopPropagation();});

有谁知道是否可以像这样更新日历?

谢谢

解决方案

这对我有用

$(".datepicker").datepicker("update", new Date());

I am using bootstrap datepicker along with a line highchart.

I want the datepicker date to update when the chart is zoomed. Once that event triggers I update the values of the datepicker. The values update fine but when the calendar is clicked, the date on the popup calendar is still the old date.

Here is my datepicker:

<div class="input-append date pull-right" id="dpStartDate" data-date="@DateTime.Now.AddMonths(-1).ToString("dd/MM/yyyy")" data-date-format="dd/mm/yyyy">
    <input class="span2" id="startDateText" size="16" type="text" value="@DateTime.Now.AddMonths(-1).ToString("dd/MM/yyyy")" readonly="">
    <span class="add-on"><i class="icon-th"></i></span>
</div>

I have tried just updating the values using this code:

$('#dpStartDate').attr('data-date', startDate);
$('#startDateText').attr('value', startDate);

which updates the dates fine but doesn't set the calendar.

I've also tried triggering the onChange event, which also updates the dates but not the calendar:

$('#dpStartDate').trigger('changeDate', startDate);

$('#dpStartDate').datepicker()
    .on('show', function (ev) {
        ev.stopPropagation();
    })
    .on('changeDate', function (ev, date) {
        var startDate = new Date();
        if (date != undefined) {
            startDate = date;
            $('#dpStartDate').attr('data-date', startDate);
            $('#startDateText').attr('value', startDate);
        }
        else {
            startDate = ev.date;
            $('#dpStartDate').attr(startDate.getDate() + '/' + (startDate.getMonth() + 1) + '/' + startDate.getFullYear());
            $('#startDateText').attr(startDate.getDate() + '/' + (startDate.getMonth() + 1) + '/' + startDate.getFullYear());
        }
        $('#dpStartDate').datepicker('hide');
        ev.stopPropagation();
    });

Does anyone know if it's even possible to update the calendar like that?

Thanks

解决方案

This works for me

$(".datepicker").datepicker("update", new Date());

这篇关于如何动态设置 bootstrap-datepicker 的日期值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！