如何在默认情况下点击文本框中的datetimepicker设置今天的日期

时间:2015-07-28 12:15:28

标签: javascript twitter-bootstrap datepicker bootstrap-datepicker bootstrap-datetimepicker

当我们选择日历图标时,它会自动将今天的日期设置为文本框。 datetimepicker()函数中是否有任何参数/选项可以设置为false或null,以防止datetimepicker()默认设置今天日期到文本框。 如果某人没有从日历中选择任何日期,则文本框应为空,而不是由datetimepicker()设置今天的日期。

2 个答案:

答案 0 :(得分:3)

值得阅读文档。在初始化datetimepicker时更改def merge[T](fw1:FooWrapper[T],fw2:FooWrapper[T]) = { FooWrapper[T](fw1.foos ++ fw2.foos) } 属性。

https://eonasdan.github.io/bootstrap-datetimepicker/Options/#usecurrent

答案 1 :(得分:0)

如果您将.datetimepicker()用于Bootstrap 4 + jQuery

当您单击该元素时,可能会发生这种不希望的日期更新效果。

这是一种避免点击时使用当前日期覆盖当前值并允许选择器正常选择的黑客。

对于Tempus Dominus版本: https://tempusdominus.github.io/bootstrap-4/

JS

var dateNow = new Date();

$('.datetimepicker').each(function() {

    var _el = this;

    $(this).datetimepicker({
        autoclose: true,
        allowInputToogle: true,
        format: 'YYYY-MM-DD HH:mm',
        defaultDate: dateNow,
    });

    // 'this.parent()' is the container and data-target  |  '_el' is the input
    $(this).parent().on('change.datetimepicker', function(e) {

        // HACK
        if (!e.oldDate) return;

        $(_el).val(e.date.format('YYYY-MM-DD HH:mm'));
    });
});

HTML

<div class="form-group">
    <label class="control-label"><i class="icon-right-open-outline"></i> Date</label>
    <div class="input-group" id="form_datetimepicker_1">

        <input name="date_selected"
               id="date_selected"
               class="form-control datetimepicker"
               type="text"
               data-toggle="datetimepicker"
               value="2019-11-22 22:55:00"
               data-target="#form_datetimepicker_1">

        <div class="input-group-append" data-target="#form_datetimepicker_1" data-toggle="datetimepicker">
            <div class="input-group-text"><i class="fa fa-calendar"></i></div>
        </div>
    </div>
</div>