I need a calendar popup for my project and I just want to show years just like this. (2000 - 2009)
I found this library Bootstrap 3 Datepicker and it seems easy. Then I've configured it to show years. Worked fine.
But I want to show 2000-2009 range in dropdown. That's the problem. I used "viewMode" option to show years. But I couldn't find anywhere to show custom year range. Here is my js code. And here is jsfiddle for live example. Any solution?
$(function () {
$('#datetimepicker10').datetimepicker({
viewMode: 'years',
format: 'L'
});
});
$('#datetimepicker10').datetimepicker({
viewMode: 'years',
defaultDate : '2005-01-01',
format: 'L'
});
set
defaultDate : '2005-01-01'
jsfiddle
Related
I have an input with a datepicker. It works properly, but when I insert a date before 01/01/100 it shows me 19xx.
For example, if I insert 01/01/0001 the calendar shows me 01/01/1901
I have read that I have to use yearRange in my script, but it doesn't work for me :(
<script type="text/javascript">
$( document ).ready(function() {
$("#fromDatePickerEnabled_input").datepicker({
yearRange: '1:9999'
});
});
</script>
How can I make that it shows me the year right?
It's already reported / discussed bug in the jQuery forums, since 2016, and unfortunately there aren't any fixes yet ...
In short: Looks like jQuery Datepicker doesn't work correctly with dates which years are less than 1000.
I tried passing different options to Datepicker (as changeYear, shortYearCutoff, yearRange), but no one fixes the problem. Even enabling changeYear: true and manually selecting the year, doesn't result in a correct Date.
It's an option to switch to bootstrap-datepicker, which doesn't have such problems with lower years.
Here you can play with it: bootstrap-datepicker playground
This question already has answers here:
Bootstrap 3 Datetimepicker 3.0.0 - make a week start on Monday
(9 answers)
Closed 6 years ago.
I want to my calendar week start with monday. Im using Bootstrap Datetimepicker, but I don't know how to do that. There's my JSFiddle.
This is my jQuery for datetimepicker
$(function () {
$('.datetimepickerinline').datetimepicker({
inline: true
});
$('.datetimepickerinline').on('change dp.change', function(e){
$('input').val($(this).data('date'));
});
});
I cant find any solutions in documentation, that's why Im asking it there :)
You have to make changes for the moment js option as implemented in answer here : Bootstrap 3 Datetimepicker 3.0.0 - week starts at Monday
JSFIDDLE : https://jsfiddle.net/ekm0on2a/16/
$(function () {
moment.locale('en', {
week: { dow: 1 } // Monday is the first day of the week
});
$('.datetimepickerinline').datetimepicker({
inline: true
});
$('.datetimepickerinline').on('change dp.change', function(e){
$('input').val($(this).data('date'));
});
});
You could set the locale to the correct value, so everyone should have it correct in their country.
$('.datetimepickerinline').datetimepicker({
inline: true,
locale: 'de'
});
Setting that to germany, the week starts with monday and also the text is in german.
I'm loading a selection of dates into bootstrap datepicker for the user to view. Currently they can click on a highlighted date but it clears all the dates that are preloaded.
I don't want them to be able to click on any dates, just view the different month pages of dates. How can I do this?
this is how I setup datepicker and load the dates;
$('.datepickera').datepicker({
format: 'yyyy/mm/dd',
multidate: false
});
$.extend($.datepicker,{_checkOffset:function(inst,offset,isFixed){return offset}});
$(".datepickera").data("datepicker").setDates($('#mydates').data('dates'));
If I understand you correctly you can make the datepicker unselectable by using the daysOfWeekDisable property like this:
$('.datepicker').datepicker({
daysOfWeekDisabled: [0,1,2,3,4,5,6]
});
0 is Sunday and 6 is Saturday. This way a user cannot select any day but can view the entire calendar. You can read more about it here. Hope that helps.
i am using jqueryDate picker.i want to customize this Datepicker.In this Datepicker Month and year is showing.Like August2014.Here if i click next it will go to next month like previous.
But I want to customize,mean i want to show months in dropdown and Year also i have to show in Dropdown,amd Next and previous function should be work.Can You Please suggest Me.
What plugin are you trying to use. If it is this plugin found in this site. then all you need to do is set the change month and changeyear to true.
$(function() {
$("YOURSELECTOR" ).datepicker({
changeMonth: true,
changeYear: true
});
});
the documentation for the api can be found here.
I'm using bootstrap 3 in a meteor project and would like to disable most of the days of the week in a datetime picker.
The other options I set seem to be working, but daysOfWeekDisabled won't disable any days.
I found this answer here Limit bootstrap-datepicker to weekdays only? that suggests it should work (and it does in the twiddle) but I can't get my code to work.
The options I'm setting are
Template.requestLayout.rendered = function(){
$('.datetimepicker').datetimepicker({
pickTime: false,
startDate: moment().day(12),
defaultDate: moment().day(12),
daysOfWeekDisabled: [0,1,2,3,6],
autoclose: true
});
}
Any ideas why it might not be working?
try changing to this
daysOfWeekDisabled: "0,1,2,3,6"