javascript - bootstrap-datetimepicker : display value of input

标签 javascript jquery twitter-bootstrap eonasdan-datetimepicker

如何说服日期时间选择器在初始页面加载时在输入文本字段中显示其值?

在这种情况下,日期选择器文本输入的值属性已经设置,但该字段显示为空白。因此,我尝试设置“data-date-defaultdate”属性,但在初始页面加载时,文本字段仍为空白。重新加载后,值按预期显示。

表格(摘录):

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

脚本:

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

有什么想法可以实现吗?

最佳答案

更改为:

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

关于javascript - bootstrap-datetimepicker : display value of input,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37733630/

相关文章:

jquery - Twitter Bootstrap 将事件类添加到 li

javascript - Twitter Bootstrap Modal 停止 Youtube 视频

javascript - Resharper 在 javascript 测试中重新排序我的路径引用

jquery - 在一个选项上点击 2 次以识别点击事件

javascript - 基本 jQuery slider 在页面加载时无法正确显示(响应式设置)

jquery - jQuery如何实现通过类名获取元素?

css - 使模态对话框的宽度固定,但是当屏幕尺寸比它小时,它必须重新调整尺寸响应

javascript - 过滤服务器返回的内容

javascript - ChartJS beginAtZero、最小值、最大值不起作用

javascript - 如何在运行时替换 PIXI.Text 对象中的文本