bootstrap-datetimepicker:输入的显示值

时间:2016-06-09 18:29:50

标签: javascript jquery twitter-bootstrap eonasdan-datetimepicker

如何说服datetimepicker在初始页面加载时在输入文本字段中显示其值?

在这种情况下,已经设置了datepicker text-input的value属性,但该字段显示为空白。因此,我尝试设置'data-date-defaultdate'属性,但在初始页面加载时,文本字段仍为空白。重新加载后,将按预期显示该值。

表格(摘录):

open

剧本:

<form name="news" method="post" class="form-horizontal">
    <div class="form-group">
        <label class="col-sm-2 control-label required" for="news_validFrom">Start time</label>
        <div class="col-sm-8 col-md-6">
            <div class="input-group date datetime-picker" id="datetime1">
                <input type="text" id="news_validFrom" name="news[validFrom]" required="required" class="form-control" value="2016-07-08T00:00:00+02:00" />
                <span class="input-group-addon">
                    <span class="fa fa-calendar"></span>
                </span>

            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label required" for="news_validTo">End date</label>
        <div class="col-sm-8 col-md-6">
            <div class="input-group date date-picker" id="datetime2">
                <input type="text" id="news_validTo" name="news[validTo]" required="required" class="form-control" value="2016-06-22T00:00:00+02:00" />
                <span class="input-group-addon">
                    <span class="fa fa-calendar"></span>
                </span>

            </div>
        </div>
    </div>
// [...]
</form>

任何想法如何使这项工作?

2 个答案:

答案 0 :(得分:1)

Chnage:

$(function () {
    $('#datetime1')
    .attr('data-date-defaultdate', $('#datetime1 input').val())
    .datetimepicker({
        format: 'DD MMM YYYY HH:mm',
        defaultDate: $('#datetime1 input').val(s),
        viewDate: 'true'
    });
    $('#datetime2')
    .attr('data-date-defaultdate', $('#datetime2 input').val())
    .datetimepicker({
        format: 'DD MMM YYYY HH:mm',
        defaultDate: $('#datetime2 input').val()
    });
});

答案 1 :(得分:0)

由于我没有找到解决此问题的方法,我尝试了另一个bootstrap-datetimepicker的分支:smalot/bootstrap-datetimepicker

这个按预期工作,我没有输入值的问题(值总是显示在文本字段中)。 我想,问题可能来自给定的日期格式(值=“2016-07-0 8T 00:00:00 +02:00 ”),但我还没弄明白。