How to set date for an inline Datepicker in jqueryUI?
When initializing a datepicker, you'd use the defaultDate option:
$("#date").datepicker({
defaultDate: '01/26/2014'
});
FIDDLE
when changing the date later, you'd use setDate method:
$("#date").datepicker();
// more code
$("#date").datepicker('setDate', '01/26/2014');
FIDDLE
You can set multiple dates as well by using this:
allBookings = []
_.each(Session.get('thisGuide').bookings,function(e){
allBookings.push(moment(e).format('MM/DD/YYYY'))
})
$('#datepicker').datepicker('setDates',allBookings)
Related
Is it possible to get the current format applied to bootstrap datepicker from the bootstrap-datepicker object?
I have several datepickers with different formats and I'd like to get the format in each of them to apply different validation methods based on the current format.
I have 3 solutions for you.
Solution 1: Declare dateFormat variable and use it on datepicker init or anywhere you want.
var dateFormat = 'mm/dd/yyyy';
$('.datepicker').datepicker({
format: dateFormat ,
startDate: '-3d'
});
Solution 2: Declare dateFormat variable and use it on $.fn.datepicker.defaults to apply for all datepickers and use it anywhere you want.
var dateFormat = 'mm/dd/yyyy';
$.fn.datepicker.defaults.format = dateFormat;
$('.datepicker').datepicker({
startDate: '-3d'
});
Solution 3: Init datepicker by data-date-format in HTML and you can get it by $("#datepicker").attr('data-date-format').
console.log($("#datepicker").attr('data-date-format'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="datepicker" class="datepicker" data-date-format="mm/dd/yyyy">
I would like to know if it is possible to change the default date of an already rendered inline datepicker? I have set up a fiddle to play around with: http://jsfiddle.net/xf0qc41k/
I currently destroy the datepicker and re-render it with a new default date if I want the default date to change. This works fine but I wondered if it is possible to change the current inline datepicker's default date on the fly.
HTML:
<div class="inline_datepicker"></div>
JS:
$('.inline_datepicker').datepicker({
dateFormat: 'yy-mm-dd',
defaultDate: "2014-10-21",
});
Just call setDate:
$('.inline_datepicker').datepicker('setDate', "2014-12-25");
I have already initialized my jquery datepicker with the format dd-M-yyyy. On some particular event I want to set that datepicket with today's date with the respective date format(dd-M-yyyy) that already I have set. I tried these codes but none of them are working, help me..
html
<input id="SD_WO_DATE" readonly="readonly" type="text">
js
$("#SD_WO_DATE").datepicker().datepicker( "option", "defaultDate", new Date() );
and
$("#SD_WO_DATE").datepicker().datepicker("setDate", new Date());
These are setting date with mm-dd-yyyy which I don't want.
Demo
Use setDate property of datepicker with today as the value,
$('#SD_WO_DATE').datepicker({ dateFormat: 'dd-M-yy' });
$('button').click(function(){
$('#SD_WO_DATE').datepicker('setDate', 'today');
});
I'm trying to find a date of birth date picker similar to the one next to the bottom on this page: http://www.pradosoft.com/demos/quickstart/?page=Controls.Samples.TDatePicker.Home
Have you seen such date picker in jQuery ?.
I actually use a combination of the day selector with dropdowns from the jQuery UI datepicker for birthday selection like so:
$('.datepicker').datepicker({
changeYear:true,
changeMonth:true,
showMonthAfterYear:true,
yearRange:'1920:' + $.datepicker.formatDate('yy', new Date())
});
I have a page where I keep track of various dates. So I end up using datepicker through jquery anywhere from 10-200 times. I want to set the default for all cases of datepicker to the 'yy-mm-dd' - but I can't seem to figure out how to set that?
I end up using datepicker through jquery anywhere from 10-200 times.
I'm assuming you're calling datepicker() separately for each input, probably by id. There's no need for that.
Use a class as a hook on your input:
<input class="my-datepicker">
Then call datepicker on elements with that class with your default configuration:
$('.my-datepicker').datepicker({
dateFormat: 'yy-mm-dd'
});
When you need a different configuration, use/assign a different class name.
You can also use setDefaults (probably what you're looking for):
$.datepicker.setDefaults({
dateFormat: 'yy-mm-dd'
});
Go to the file jquery.ui.datepicker.js.
function Datepicker()
{
dateFormat: 'mm/dd/yy'
}
Change it to the format you prefer. It will change the format for your whole website.