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" }));
});
});
Related
How can I change the setting of one datepicker inside of other datepicker?
This is what I tried
$('#from_date').datepicker({
autoclose:true,
}).on('changeDate', function() {
$('#to_date').datepicker({
minDate: $('#from_date').val(),
});
});
I also tried this
$('#from_date').datepicker({
autoclose:true,
}).on('changeDate', function() {
$('#to_date').datepicker('option', 'minDate', $('#from_date').val())
});
I want to disable the date before the from_date value if the from_date date is changed.
Thanks for the help
Try setStartDate method
Note: jquery-ui-datepicker and bootstrap-datepicker are different
$('#from_date').datepicker({
autoclose:true,
}).on('changeDate', function(e) {
$('#to_date').datepicker('setStartDate', e.date)
});
You should use the option api.
Use it like this:
example:
$( ".selector" ).datepicker( "option", "disabled", true );
With your code:
$('#to_date').datepicker( "option", "minDate", $('#from_date').val())
could anyone please help?
I am using jquery datepicker for several fields and in an update form in php and it updates dates in database. All seems to work great except the fact that if some of the date fields are already populated in DB, the datepicker does not display them and upon update it erases the value in DB too.
the php sample:
<script>
$( function() {
$( "#datepicker" ).datepicker();
$( "#datepicker" ).datepicker("option", "dateFormat", "yy-mm-dd");
} );
</script>
...
<td><input type="text" id="datepicker" name="IM_request" value="'.$row["IM_request"].'"/></td>
So the variable $row["IM_request"] does not display if datepicker is enabled. if i disable it, it works fine, but a lot of manual work.
Any idea how to make the datepicker-enabled input field to display the value from DB?
<input type="text" id="txtSelectedDate" value="20-01-01" />
$('#txtSelectedDate').datepicker({
showButtonPanel: true,
dateFormat: 'dd-mm-yy',
});
JSFiddle example : http://jsfiddle.net/LgTZt/211/
I finally found the solution. Instead of:
$( function() {
$( "#datepicker" ).datepicker();
$( "#datepicker" ).datepicker("option", "dateFormat", "yy-mm-dd");
} );
I should have used:
$( function() {
$( "#datepicker" ).datepicker({dateFormat: "yy-mm-dd"});
} );
I am choosing a date with submit. What I want to do is keeping this date on the form when I am redirected to another web page.
https://jsfiddle.net/92gd7v26/
I tried this but it's not working:
$name7=$_SESSION['date'];
$name8=$_SESSION['date2'];
$name9=$_SESSION['date3'];
<script>// <![CDATA[
$( function() { $( "#datepicker" ).datepicker(); $( "#datepicker2" ).datepicker(); $( "#datepicker3" ).datepicker();
$('#datepicker').datepicker({
inline: true,
showOtherMonths: true,
})
$("#datepicker").datepicker("setDate", $name7);
$("#datepicker2").datepicker("setDate", $name8);
$("#datepicker3").datepicker("setDate", $name9);
} );
// ]]></script>
I don't know what's wrong. I am able to get the "date" values from $name7,$name8 and $name9. But when I try to put them on .datepicker("setDate") I am not getting the values I sent..
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
I have datepicker codes below to display me calendar, the current date is selected by default, i would like to select the previous date by default instead (the day before today). I have tried but i failed anybody can help me please?
$(function() {
$("#datepicker").datepicker({ dateFormat: "yy-mm-dd" }).val()
});
I finally resolved my issue this way
$(function() {
$("#datepicker").datepicker({ dateFormat: "yy-mm-dd" }).val();
$("#datepicker").click(function() {
date = new Date();
date.setDate(date.getDate()-1);
$( "#datepicker" ).datepicker( "setDate" , date);
});
});
Try this:
$(".datepicker").datepicker("setDate", -1)
More info: http://api.jqueryui.com/datepicker/#method-setDate