I know there are loads of questions on here about changing the datepicker dateFormat, but i'm following the instructions exactly and they seem to have no effect. Here is the exact code that was suggested on other answers:
$(document).ready(function() {
$('#datepicker').datepicker({ dateFormat: 'dd-mm-yy' });
});
Yet when I run it, and test the datepicker value with alert($('#datepicker').datepicker("getDate"));
I get the date back in the undesired format! This is extremely confusing. Am I something wrong? See the described behaviour at http://jsfiddle.net/TmdM8/
edit: even more confusing is that if I read the dateformat using alert($("#datepicker").datepicker('option', 'dateFormat'));
... the returned dateFormat is correct, even though calling getDate does not return the date in the desired format. See http://jsfiddle.net/fWmBe/
the date format setting is for what the format looks like when it's show in the text box the picker is applied to.
have a look at my updated version of your fiddle:
http://jsfiddle.net/TmdM8/1/
as you can see, when you pcick in the text box, and pick a date, it is in the format you have specified.
as far as i know, the getDate function returns a javascript date.
EDIT:
if you wanted to format the output from the javascript date, you'll need to use a custom script, or a library like date.js (i've had great success with this).
http://code.google.com/p/datejs/
with that you could do something like :
$('#datepicker').datepicker("getDate").toString('dd-MM-yyyy');
to get your date in the format you like
I agree that it returns a javascript date. You can use this utility function:
$.datepicker.formatDate( format, date, settings ) - Format a date into a string value with a specified format.
from http://docs.jquery.com/UI/Datepicker/formatDate
What is happening here is getDate is return a javascript date object. You are seeing the date object's toString method.
Try this:
$(document).ready(function() {
$('#datepicker').datepicker({
onSelect: function(dateText, inst) { alert(dateText) }
});
$('#datepicker').datepicker( "option" , 'dateFormat', 'yyyy-mm-dd' )
});
in case someone looking for this answer like me. here is a working code:
<script>
$(function() {
$( "#datepicker" ).datepicker({inline: true, dateFormat:'yy-mm-dd'}); });
</script>
Related
I've to use the bootstrap datetimepicker for a legacy project.
With "LT" format, I've an issue, even if I set a default date, it returns the current date. (today).
check it on
codepen
$(function () {
$('#datetimepicker3').datetimepicker( {
defaultDate: moment("15/05/1992","DD/MM/YYYY"),
format: 'LT'
});
$('#datetimepicker3').on('dp.change',function(){
console.log('-');
console.log($('#datetimepicker3').data('DateTimePicker').date());
console.log($('#datetimepicker3').data('DateTimePicker').date().format('DD/MM/YYYY HH:mm'));
console.log('-');
});
});
I need to receive the date I set by default in datetimepicker.
Thanks.
I think the problem is exactly because you are using 'LT'. LT is a format of TIME-ONLY, so the information about the date is lost. That way, when it transform the "only time" information to a date or moment object, it uses the current date.
The defaultDate is to set the initial date/time for the component and not to define the date that will be used when dealing with time-only information.
My suggestion: take the value from the component (as you did), extract the time and then set the desired date for that time.
I hope it helps.
I've a field and applying datepicker on it using jQuery.
it is currently getting time from system/browser.
I want it to get time from specific time zone e.g America/new_york.
The endDate param is the key to set the calendar, means user should not be able to select the date from future. Currently it is looking like this
The code snippet is :
jQuery('#convo_start_date').datepicker({
format: 'dd M yyyy',
endDate: '+0d',
autoclose: true,
showButtonPanel: true,
todayBtn: 'linked'
}).on('change', function () {
jQuery('.datepicker').hide();
jQuery('#convo_end_date').attr('value',jQuery('#convo_start_date').val());
});
Question: Is there any way to set the default specific timezone like America/new_york to do not allow the date from future (according to this specific timezone)?
Note: I've tried moment.js but it is conflicting with my current work in jQuery, Is there any params datepicker library providesvto set with timezone?
If you are using jquery ui datepicker plugin, you can set the maxDate option to current date so that user can't select date from future.
You will need to do the conversion to the specific timezone. You can change the targetTimeOffset variable as per your requirement.
var d = new Date();
var targetTimeOffset = -4*60; //desired time zone, taken as GMT-4
d.setMinutes(d.getMinutes() + d.getTimezoneOffset() + targetTimeOffset );
Check Fiddle: http://jsfiddle.net/mpsingh2003/8w8v9/3387/ if this is what you are looking for
You can use Joda-Time library to get your solution.
Check the classes they provide like org.joda.time.DateTimeZone.
You can get the DateTimeZone depending on the Canonical ID defined in the Joda Time.
Please check this link for API documentation.
Hope this will helpful for you. Thanks.
I'm using the Jquery datepicker to add the selected dates to an SQL database in time format using dateFormat : '#'.
However, this uses js milliseconds and I need it in UNIX timestamp format which is in seconds. So basically I get an extra 3 zeros on the end.
I know I can /1000 to get the correct integer, but how do I do that in the js before it is entered into the db?
This is what I have so far:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('.MyDate').datepicker({
dateFormat : '#'
});
});
</script>
try the below, it has temp value for your SQL DB.
var tempSQLvalue;
jQuery(document).ready(function() {
jQuery('.MyDate').datepicker({
dateFormat : '#',
onSelect: function(date) {
tempSQLvalue = date.slice(0,date.length-3);
console.log(tempSQLvalue);
}
});
})
Posting this answer for anyone else who has the same issue. Instead of using timestamps, I stuck to standard date formats. However, you need to check the different date formats between jquery and php. For example, the date 03-01-16 in jquery will be 'dd-mm-yy' while in php, the same date format would be 'd-m-Y'.
When i fetch date from the db it is in following format :-
{5/13/2002 12:00:00 AM}
When i pass this as Json, i bind it to textbox & it shows me like this :-
/Date(1021228200000)/
How to display date in any correct format?
Extending this question I want to bind the date to html5 datepicker, How to do this?
var jsonDate = "/Date(1021228200000)/";
var date = new Date(parseInt(jsonDate.substr(6)));
The substr function takes out the "/Date(" part, and the parseInt function gets the integer and ignores the ")/" at the end. The resulting number is passed into the Date constructor.
jQuery dateFormat is a separate plugin. You need to load that explicitly.
Reference
You can use like below to display datetime and bind date to html5 datepicker.
<input class='selector' id='datepicker'/>
$( ".selector" ).datepicker({ dateFormat: 'yy-mm-dd' }).val();
I'm using Timepicker (extended Datepicker from jQuery UI here).
My code:
$('.one').datepicker({
dateFormat: "d"
});
$('.two').timepicker({
timeFormat: "hh"
});
When I click on field .two, Firebug shows me an error:
Error parsing the date string: Unexpected literal at position 2
date string = 10
date format = mm/dd/yy
timepicker.js (line 1911)
Everything seems to work just fine, but I wonder why is this error showing up and how can I make it disappear?
EDIT:
Actually my code looks like this:
$('.one').datepicker({
dateFormat: "d m y"
});
$('.two').timepicker({
timeFormat: "hh mm"
});
EDIT2:
http://jsfiddle.net/r9bCk/
Gury,
Try to include the addon v.1.1.0 from here, and hopefully it resolves the error.
It's the same version I'm using.
Clearly there's a bug in the new versions.
The error is coming from the timepicker plugin itself.
It is there in the example link.
See $('#basic_example_2').timepicker(); after a selection.
Use a previous stable version as AsemRadhwi suggested