无法更改 Bootstrap DateTimePicker 的格式

Question

我想将我的 DateTimePicker 格式设置为 yyyy-mm-dd 因为这是我插入数据库的格式。

这是标记：

<div class="col-sm-6">
   <div class="input-group date" data-provide="datepicker">
     <input type="text" class="form-control" id="repdate" name="repdate" placeholder="Report date" required>
       <div class="input-group-addon">
         <span class="glyphicon glyphicon-th"></span>
       </div>
    </div>
</div>

这是我为更改格式而编写的代码，但它不起作用：

$(document).ready(function() {    
    $(function () {        
        $('.datepicker').datetimepicker({
            format: 'YYYY-MM-DD'
        });
    });    
});

Answer 1

  $('.datetimepicker').datetimepicker({
    timepicker: false,
    format: 'Y-m-d',
    closeOnDateSelect: true,
    scrollInput: false
  });

Answer 2

在您的 jQuery 代码中，它使用了日期选择器 class 但您没有正确使用它。你应该像下面这样使用它

<div class="col-sm-6">
    <div class="input-group date datepicker">
        <input type="text" class="form-control" id="repdate" name="repdate" placeholder="Report date" required>
        <div class="input-group-addon">
            <span class="glyphicon glyphicon-th"></span>
        </div>
    </div>
</div>

无论如何，您不必在数据库中使用相同的格式，因为您稍后可以使用正确的数据库格式更新后端代码上的日期。

Answer 3

问题出在您的 jQuery 选择器上，您应该使用 $('[data-provide="datepicker"]') 而不是 $('.datepicker') 或在您的输入中添加 datepicker class。

这是一个工作示例：

$('[data-provide="datepicker"]').datetimepicker({
  format: 'YYYY-MM-DD'
});

<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>

<div class="col-sm-6">
   <div class="input-group date" data-provide="datepicker">
     <input type="text" class="form-control" id="repdate" name="repdate" placeholder="Report date" required>
       <div class="input-group-addon">
         <span class="glyphicon glyphicon-th"></span>
       </div>
    </div>
</div>

无法更改 Bootstrap DateTimePicker 的格式

Can't change the format of Bootstrap DateTimePicker

javascript

bootstrap-datetimepicker