Develop Reference

jQuery datepicker with German format

I need to change jQuery datepicker formatting from MM/DD/YYYY to German style like d MMMM yyyy.
I have tried this code but it does not work with me.
<script type="text/javascript">
$(function () {
$('.datepicker').datepicker();
$(".selector").datepicker({ dateFormat: 'd-MMMM-yyyy });
});
</script>
The date format shows like this and never change!
What is wrong in my code any idea?
thanks

German date format is dd.mm.yyyy you can use like this
$(".selector").datepicker({ dateFormat: 'dd.mm.yyyy' });

You can use this
<script type="text/javascript">
$(function() {
$('.selector').datepicker({
dateFormat: 'dd.mm.yy'
}
);
});
</script>

<script type="text/javascript">
$(function () {
$(".datepicker").datepicker();
$(".selector").datepicker({ dateFormat: "dd-MM-yyyy"});
});
</script>

Datepicker & Jinplace

I have Datepicker and it's working fine please check jsfiddle here.
Also I have Jinplace JQuery plugin and it's also working fine please check jsfiddle here.
But I can not get them to work together, I mean put datepicker inside editable jinplace div please check jsfiddle here.
Code:
$('.editable').jinplace({
});
$.fn.jinplace.editors.birthday = {
makeField: function(element, data) {
// Create a label with a checkbox inside it.
var input = $('<input id="datepicker">');
return input;
}
};
$(function() {
$( "#datepicker" ).datepicker({
yearRange: "1900:2016",
dateFormat: "yy-mm-dd",
changeYear: true
});
});
In this case Jinplace generate HTML code like:
<div class="editable" data-type="birthday">
<form action="javascript:void(0);" style="display: inline;">
<input id="datepicker2">
</form>
</div>
But input#datepicker appears in HTML only after clicking on div.editable and have not been listed in the html code before this click. Like this:
<div class="editable" data-type="birthday">
</div>
Please check jsfiddle links above for more info.
How can I get them to work together?

This is because your input does not exist when the datepicker is initialised. You will need to make the datepicker call, which is this code:
$( "#datepicker" ).datepicker({
yearRange: "1900:2016",
dateFormat: "yy-mm-dd",
changeYear: true
});
once the input is rendered on the dom using jinplace.
As far as jinplace's documentation goes I cant find an onload event, So I am not sure how to go about this, unfortunately. But looking at the source code and your example, this might work:
$.fn.jinplace.editors.birthday = {
makeField: function(element, data) {
// Create a label with a checkbox inside it.
var input = $('<input id="datepicker">');
return input;
},
activate: function (form, field) {
field.datepicker({
yearRange: "1900:2016",
dateFormat: "yy-mm-dd",
changeYear: true
});
field.focus();
},
};
I haven't tested this. Good luck!

jquery datepicker events not working properly

when i click in jquery calendar it display value first time and then when i click another time another value it doesn't work .
<script>
$(function(){
$( "#datepicker" ).datepicker();
$( ".ui-state-default" ).on('click',function(event){
alert(event.toElement.outerText);
})
});
</script>
check demo here http://jsfiddle.net/epHNZ/592

Just try this,
$(function() {
$("#datepicker").datepicker();
$("#datepicker").on('click', '.ui-state-default', function(e){
alert(e.toElement.outerText);
});
});
DEMO
or
May be above example unsupported in some browsers, in that case use this
$(function(){
$("#datepicker").datepicker({
onSelect: function(dateText, inst) {
var date =$(this).datepicker('getDate');
alert(date.getDate());
}
})
});
DEMO

Validation in Jquery datepicker

I want to set maximum limit in JQuery Datepicker so that the user can't pick date after current date. Currently I'm using http://jqueryui.com/datepicker/ plugin.
How to set maximum limit in JQuery datepicker ?

you can validate by Jquery
$(document).ready(function(){
if($("#datepicker").val() == ''){
alert("Please Select Your date");
}
});

try this- just in the datepicker function you are using pass these parameters
$("#date").datepicker({
onSelect: function(selectedDate) {
$( "#date1" ).datepicker( "option", "maxDate", selectedDate);
}
});

Try
option-maxDate
Working Demo
$("#date").datepicker("option","maxDate",0);
or
$("#date").datepicker("option","maxDate",new Date());
Working Demo
$(function () {
$("#date").datepicker({
maxDate: 0
});
});

$("#date").datepicker({
dateFormat: 'dd/mm/yy',
minDate: 0,
maxDate: "+30M",
});
fore more look here

JQuery Mobile UI DatePicker Change Date Format

I am trying to change the date format in the JQM UI Datepicker.
It's got an input which display's the dates as you change them.
I need it to display in dd/mm/yyyy format.
Can anyone help please?
UPDATE:
I'm trying this, but nothing's changing:
<script>
//reset type=date inputs to text
$( document ).bind( "mobileinit", function(){
$.mobile.page.prototype.options.degradeInputs.date = true;
});
</script>
<script language="javascript">
$(document).ready(function() {
$.datepicker.formatDate('dd/mm/yyyy'); //ADDED HERE
$("input[type='submit']").click(function(e) {
e.preventDefault();
});
});
</script>

Try this $.datepicker.formatDate('dd/mm/yyyy');
More reference here

Change the "jquery.ui.datepicker.mobile.js" file
add date format: dateFormat: "dd/mm/yy" Code shown below
//bind to pagecreate to automatically enhance date inputs
$( ".ui-page" ).live( "pagecreate", function(){
$( "input[type='date'], input[data-type='date']" ).each(function(){
$(this).after($("<div />").datepicker({ altField: "#" + $(this).attr("id"), showOtherMonths: true, dateFormat: "dd/mm/yy" }));
});
});