I am using bootstrap date time picker in my web application, made in PHP/HTML5 and JavaScript. I am currently using one from here: http://tarruda.github.io/bootstrap-datetimepic
<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>
The selector criteria is now an attribute the DIV tag.
examples are ...
data-date-format="dd MM yyyy"
data-date-format="dd MM yyyy - HH:ii p
data-date-format="hh:ii"
so the bootstrap example for dd mm yyyy is:-
<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>
my Javascript settings are as follows:-
var picker_settings = {
language: 'en',
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2,
minView: 2,
forceParse: 0
};
$(datePickerId).datetimepicker(picker_settings);
You can see working examples of these if you download the bootstrap-datetimepicker-master file. There are sample folders each with an index.html.
This is for: Eonasdan's Bootstrap Datetimepicker
First of all I would provide an id
attribute for the <input>
and then initialize the datetimepicker directly for that <input>
(and not for the parent container):
<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>
For v3: Contrary to Ck Maurya's answer:
pickDate: false
will disable the date and only allow to pick a timepickTime: false
will disable the time and only allow to pick a date (which is what you want).For v4: Bootstrap Datetimepicker now uses the format to determine if a time-component is present. If no time component is present, it won't let you choose a time (and hide the clock icon).
I tried all of the solutions posted here but none of them worked for me. I managed to disable the time by using this line of code in my jQuery:
$('#datetimepicker4').datetimepicker({
format: 'YYYY-MM-DD'
});
This set the format to date only and disabled the time completely. Hope this helps.
This shows only date:
$('#myDateTimePicker').datetimepicker({
format: 'dd.mm.yyyy',
minView: 2,
maxView: 4,
autoclose: true
});
More on the subject here
$("#datetimepicker4").datepicker({
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
showOtherMonths: true,
selectOtherMonths: true,
pickTime: false,
format: 'YYYY-MM-DD'
});