At the the moment, we're using the datetimepicker in a semi-modular way because the initialization is done in javascript. Formerly we were using a different datepicker component which lacked the time picking function but could be initialized via data-attributes. This made things a lot easier because in the asp.net MVC 5 project in which that component was used, we could simply create an editor template that was referenced whenever a datepicker was needed, without having to write any javascript. I'd like to stick to that usage pattern but have not been able to find any documentation about it in the docs. Am I missing something or this not (yet) possible with the Bootstrap 3 Datepicker?
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试):
问题:
回答1:
You can init datepicker options using data attributes, as you can see in the following example:
$('#datetimepicker1').datetimepicker();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.1/moment-with-locales.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/d004434a5ff76e7b97c8b07c01f34ca69e635d97/src/js/bootstrap-datetimepicker.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/d004434a5ff76e7b97c8b07c01f34ca69e635d97/build/css/bootstrap-datetimepicker.css" rel="stylesheet">
<div class="row">
<div class="col-md-12">
<div class="form-group">
<div class="input-group date" >
<input type='text' class="form-control" id="datetimepicker1" data-date-format="YYYY/MM/DD HH:mm" data-date-show-today-button="true" data-date-show-clear="true"/>
</div>
</div>
</div>
You can use data-date-*
to set an option or data-date-options
setting an option object. The data-*
initialization, in my opinion, it's poorly documented, anyway you can find some reference to it here.