[英]Bootstrap datetime picker plugin?
Here is a simple DatePicker that works. 这是一个有效的简单DatePicker。
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/>
<script>
$(document).ready(function(){
var date_input=$('input[name="date"]'); //our date input has the name "date"
var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
var options={
format: '"dd/MM/yyyy - hh:ii"',
container: container,
todayHighlight: true,
autoclose: true,
};
date_input.datetimepicker(options);
})
</script>
<head>
<body>
<div class="form-group"> <!-- Date input -->
<label class="control-label" for="date">Date</label>
<input class="form-control" id="date" name="date" placeholder="MM/DD/YYY" type="text"/>
</div>
</body>
How should the above code change in order to make it use a DATETIME picker? 为了使它使用DATETIME选择器,上述代码应如何更改? Im assuming I need to use different plugins within the header? 我假设我需要在标题中使用其他插件? Please could someone advise? 有人可以请教吗?
$(function() { $('#datetimepicker1').datetimepicker(); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.7.14/js/bootstrap-datetimepicker.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.7.14/css/bootstrap-datetimepicker.min.css"> <div class="container"> <div class="row"> <div class='col-sm-6'> <div class="form-group"> <div class='input-group date' id='datetimepicker1'> <input type='text' class="form-control" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> </div> </div>
Source: https://eonasdan.github.io/bootstrap-datetimepicker/ 资料来源: https : //eonasdan.github.io/bootstrap-datetimepicker/
Make working in SO with help from : https://stackoverflow.com/a/40036266/4091337 and @Abhishek in comments 在以下帮助下在SO中工作: https ://stackoverflow.com/a/40036266/4091337和@Abhishek
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.