В моем веб-приложении, используемом в PHP/HTML5 и JavaScript, я использую bootstrap date time picker. В настоящее время я использую один из них: http://tarruda.github.io/bootstrap-datetimepicker/
Когда я использую элемент управления без времени, он не работает. Он просто показывает пустое текстовое поле.
Я просто хочу удалить время с даты выбора времени. Есть ли какое-либо решение для этого?
<div class="well">
<div id="datetimepicker4" class="input-append">
<input data-format="yyyy-MM-dd" type="text"></input>
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"> </i>
</span>
</div>
</div>
<script type="text/javascript">
$(function() {
$('#datetimepicker4').datetimepicker({ pickTime: false });
});
</script>
Проверьте приведенный ниже фрагмент
<div class="container">
<div class="row">
<div class='col-sm-6'>
<div class="form-group">
<div class='input-group date' id='datetimepicker4'>
<input type='text' class="form-control" />
<span class="input-group-addon"><span class="glyphicon glyphicon-time"></span>
</span>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
// Bootstrap DateTimePicker v4
$('#datetimepicker4').datetimepicker({
format: 'DD/MM/YYYY'
});
});
</script>
</div>
Вы можете обратиться к http://eonasdan.github.io/bootstrap-datetimepicker/ для подробной документации и других функций. Это должно сработать.
Используйте локализованные форматы moment.js:
L
только для датыLT
только на времяL LT
для даты и времениСм. Другие локализованные форматы в документации moment.js(https://momentjs.com/docs/#/displaying/format/)
div
(возможно, библиотека обрабатывает это и ищет <input>
-sub-elements)
Я пробовал все решения, размещенные здесь, но ни один из них не работал у меня. Мне удалось отключить время, используя эту строку кода в моем jQuery:
$('#datetimepicker4').datetimepicker({
format: 'YYYY-MM-DD'
});
Это задает формат только по дате и полностью отключает время. Надеюсь, это поможет.
Это для: Eonasdan Bootstrap Datetimepicker
Прежде всего, я бы предоставил атрибут id
для <input>
, а затем инициализировал datetimepicker непосредственно для этого <input>
(а не для родительского контейнера):
<div class="container">
<input data-format="yyyy-MM-dd" type="text" id="datetimepicker"/>
</div>
<script type="text/javascript">
$(function() {
// Bootstrap DateTimePicker v3
$('#datetimepicker').datetimepicker({
pickTime: false
});
// Bootstrap DateTimePicker v4
$('#datetimepicker').datetimepicker({
format: 'DD/MM/YYYY'
});
});
</script>
Для v3: вопреки Ck Maurya ответ:
pickDate: false
отключит дату и позволит выбрать времяpickTime: false
отключит время и позволит выбрать дату (именно это вы хотите).Для v4: Bootstrap Datetimepicker теперь использует формат, чтобы определить, присутствует ли компонент времени. Если компонент времени отсутствует, он не позволит вам выбрать время (и скрыть значок часов).
Я потратил некоторое время, пытаясь понять это из-за обновления с помощью DateTimePicker
. Вы входите в формат, основанный на документации moment.js. Вы можете использовать другие ответы:
$('#datetimepicker').datetimepicker({ format: 'DD/MM/YYYY' });
Или вы можете использовать некоторые локализованные форматы. moment.js позволяет делать только дату, например:
$('#datetimepicker').datetimepicker({locale: 'fr', format: 'L' });
Используя это, вы можете отображать только время (LT
) или дату (L
) на основе языкового стандарта. Документация для datetimepicker не ясна для меня, что она автоматически адаптируется к предоставленному вводом (дате или только времени) через формат moment.js
. Надеюсь, это поможет тем, кто все еще смотрит.
$('#datetimepicker').datetimepicker({
minView: 2,
pickTime: false,
language: 'pt-BR'
});
Попробуйте, если это сработает и для вас
Инициализируйте свой datetimepicker следующим образом
Отключить время
$(document).ready(function(){
$('#dp3').datetimepicker({
pickTime: false
});
});
Отключить дату
$(document).ready(function(){
$('#dp3').datetimepicker({
pickDate: false
});
});
Чтобы отключить дату и время
$(document).ready(function(){
$("#dp3").datetimepicker('disable');
});
пожалуйста, обратитесь к следующей документации, если у вас есть какие-либо сомнения.
<div class="container">
<input type="text" id="datetimepicker"/>
</div>
<script type="text/javascript">
$(function() {
// trigger datepicker
$('#datetimepicker').datetimepicker({
pickTime: false,
minView: 2,
format: 'dd/mm/yyyy',
autoclose: true,
});
});
</script>
Показывает только дату:
$('#myDateTimePicker').datetimepicker({
format: 'dd.mm.yyyy',
minView: 2,
maxView: 4,
autoclose: true
});
Подробнее о теме здесь
$(function () {
$('#datetimepicker9').datetimepicker({
viewMode: 'years',
format: 'DD/MM/YYYY' /*Add this line to remove time format*/
});
});
Критерии выбора теперь атрибут тега DIV.
Примеры...
data-date-format="dd MM yyyy"
data-date-format="dd MM yyyy - HH:ii p
data-date-format="hh:ii"
поэтому пример бутстрапа для dd mm yyyy: -
<div class="input-group date form_date col-md-5" data-date=""
data-date-format="dd MM yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd">
..... etc ....
</div>
мои настройки Javascript следующие: -
var picker_settings = {
language: 'en',
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2,
minView: 2,
forceParse: 0
};
$(datePickerId).datetimepicker(picker_settings);
Вы можете увидеть рабочие примеры этих файлов, если вы загрузите файл bootstrap-datetimepicker-master. Есть примеры папок с индексом index.html.
<script type="text/javascript">
$(function () {
$('#datepicker').datetimepicker({
format: 'YYYY/MM/DD'
});
});
</script>
Это позволяет отображать время в поле ввода, но скрывает кнопку выбора времени, которая является вторым элементом li в аккордеоне
.bootstrap-datetimepicker-widget .list-unstyled li:nth-child(2){
display: none;
}
your same code work fine, just add some link reference
<!DOCTYPE HTML>
<html>
<head>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="screen"
href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
</head>
<body>
<div class="well">
<div id="datetimepicker4" class="input-append">
<input data-format="yyyy-MM-dd" type="text"></input>
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"> </i>
</span>
</div>
</div>
<script type="text/javascript"
src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script type="text/javascript"
src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
</script>
<script type="text/javascript"
src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
</script>
<script type="text/javascript"
src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js">
</script>
<script type="text/javascript">
$(function () {
$('#datetimepicker4').datetimepicker({pickTime: false});
});
</script>
</body>
</html>
Отключить время в сборщике datetime для сбора данных...
$(document).ready(function () {
$('.timepicker').datetimepicker({
format: "dd-mm-yy",
});
});
Отключить дату в сборщике datetime для сбора данных...
$(document).ready(function () {
$('.timepicker').datetimepicker({
format: "HH:mm A",
});
});
Вот решение для вас. Очень просто добавить код следующим образом:
$('#datetimepicker4').datetimepicker({
pickTime: false
minview:2;(Please see here.)
});
Я знаю, что это поздно, но ответ просто удаляет "время" из слова datetimepicker
, чтобы изменить его на datepicker
. Вы можете отформатировать его с помощью dateFormat
.
jQuery( "#datetimepicker4" ).datepicker({
dateFormat: "MM dd, yy",
});
$("#datetimepicker4").datepicker({
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
showOtherMonths: true,
selectOtherMonths: true,
pickTime: false,
format: 'YYYY-MM-DD'
});
Не как время от времени и язык Я положил это и не работал.
$(function () {
$('#datetimepicker2').datetimepicker({
locale: 'es',
pickTime: false
});
});