Develop Reference

How can I use mm-yy format with datepicker?

I'm starting with javascript and I have a little problem with the datepicker. I have an object created which select a date from a panel (with format mm-yy). The problem is that if I write a date manually it doesn't save that data and puts the default one in the displayed calendar. I need to define the date both from the calendar and by written in the text box. This problem doesn't occur when the format is dd-mm-yy, but I need the mm-yy format. Thank you!
The code is:
$(function() {
$('.calendar').datepicker( {
showButtonPanel: true,
dateFormat: 'mm-yy',
onClose: function(selectedText, inst) {
$(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
}
});
});

Date from calendar
$(function() {
$('#datepicker').datepicker( {
showButtonPanel: true,
dateFormat: 'dd-mm-yy',
onClose: function(dateVal) {
var ym = dateVal.substring(3);
document.getElementById("datepicker").value = ym;
}
});
});

Format date of JQuery Datepicker [duplicate]

I use the datepicker from jQuery UI, but the format is like example today: 08/01/2013
But i want the format to be example today: 2013-08-01
Here is code line i think maybe i should use?
`$( "#txtFromDate" ).datepicker( "option", "dateFormat", "yyyy-mm-dd" );`
And here is my jQuery code i use that works fine but don't know where to put the line?
And i want the format in both of my fields.
`
$(document).ready(function(){
$("#txtFromDate").datepicker({
minDate: "07/17/2012",
maxDate: "0D",
numberOfMonths: 2,
onSelect: function(selected) {
$("#txtToDate").datepicker("option","minDate", selected);
}
});
$("#txtToDate").datepicker({
minDate: "07/17/2013",
maxDate:"0D",
numberOfMonths: 2,
onSelect: function(selected) {
$("#txtFromDate").datepicker("option","maxDate", selected);
}
});
});`
I hope somebody have a solution for this :-)

since your already have other options in the datepicker... add it there.
try this
$("#txtFromDate").datepicker({
minDate: "07/17/2012",
maxDate: "0D",
numberOfMonths: 2,
dateFormat: "yy-mm-dd", //<----here
onSelect: function(selected) {
$("#txtToDate").datepicker("option","minDate", selected);
}
});

You can directly set the date format from jquery-ui library,that's work for me.hope for you also
in
function Datepicker()
{
//other code
dateFormat: "yy-mm-dd", // See format options on parseDate
//other code
}

Why datepicker show same month when change month on a first time on autoOpening second datepicker

Click on the first field;
select any day; (then automatic opening second datepicker)
click next month button
showing datepicker has flash, but month not change
after this, next month button (and prev month button) have work.
WHYYYYYYY ?????
Fiddel Demo
$(".from_date").datepicker({
minDate: 'D',
dateFormat: "dd/mm/yy",
defaultDate: "+1w",
numberOfMonths: 2,
onClose: function(selectedDate) {
$(".to_date").datepicker("option", "minDate", selectedDate);
$(this).parents('.span2').next().children().find('.to_date').focus();
}
});
$(".to_date").datepicker({
minDate: '+1D',
dateFormat: "dd/mm/yy",
defaultDate: "+1w",
numberOfMonths: 2
});

I can confirm the bug, it has something to do with opening the second datepicker from the onClose function, adding a zero delay timeout seems to work though:
onClose: function(selectedDate) {
var $toDate = $(this).closest('.span2').next().find('.to_date');
$toDate.datepicker("option", "minDate", selectedDate);
setTimeout(function(){$toDate.datepicker('show')},0);
}
Updated fiddle
Note: I changed your code a bit, I optimized your .to_date selector and made it so only the corresponding input is updated with the selected date

Setting the minimum date of jquery datepicker

I am working on a project which involves using HTML5 and Javacript/JQuery. I am trying to make use of the Jquery datepicker and trying to set the minimum date to today's date so the user can't select a date from yesterday.
Below is my Javascript.
$(function()
{
var today = new Date();
$("#txtStartDate").datepicker(
{
changeMonth: true,
numberOfMonths: 1,
minDate: new Date(today.getYear(), today.getMonth() +1, today.getDay()),
onClose: function(selectedDate)
{
$("#txtStartDate").datepicker("option", "dateFormat", "dd-mm-yy", selectedDate);
}
});
});
It doesn't seem to be making any difference as I can still go back to days before yesterday.
Thanks for any help you can provide.

I guess you did'nt read the documentation ?
minDate
Type: Date or Number or String
Default: null
The minimum selectable date. When set to null, there is no minimum.
Multiple types supported:
Date: A date object containing the minimum date.
Number: A number of days from today. <- set to 0, it's no days from today !
So setting minDate to 0 should work, right !
$(function () {
var today = new Date();
$("#txtStartDate").datepicker({
changeMonth: true,
numberOfMonths: 1,
minDate: 0,
onClose: function (selectedDate) {
$("#txtStartDate").datepicker("option", "dateFormat", "dd-mm-yy", selectedDate);
}
});
});

How to get datepicker data in jQuery-ui?

How can I get data of a datapicker in jQuery ui?
I've the next code but only get default value. (I use only years)
$('#datePickerTempe').datepicker( {
changeMonth: false,
changeYear: false,
dateFormat: 'MM yy',
//To hide months:
stepMonths: 12,
monthNames: ["","","","","","","","","","","",""],
//Range
minDate: '-4y', //'M'-> month | 'w'-> week | 'd'-> day
maxDate: '0y',
buttonImageOnly: true
});
$('#datePickerTempe').on('click', function(){
console.log('año: '+$('#datePickerTempe').val()); });

Get current date from datepicker (or null if nothing selected):
var selectedDate = $('#datePickerTempe').datepicker("getDate");
You can also add onSelect handler to datepicker:
$('#datePickerTempe').datepicker( {
onSelect: function (dateText, inst) {
console.log(dateText);
}
});
Refer to datepicker getDate method and datepicker onSelect option

<input type="text" id="date" name="date" value=""/>
<script>
var date_fields = $('#date');
date_fields.datepicker({
format: 'mm/dd/yyyy'
}).on('changeDate', function(ev){
date_fields.datepicker('hide');
date_fields.blur();
});
</script>
The added scripts http://www.eyecon.ro/bootstrap-datepicker/

$("#datepicker").change(function() {
alert($(this).val());
});
Works perfectly fine here.