I use the popular JQuery UI Datepicker to add/modify events on my web site. I am having a problem with getting the date to show up right using setDate. The incorrect date seems to always show up no matter what I do. Here are some various things I have tried:
The date shows up as 01/17/1970 when it should be 10/15/2015, this is how I need it to work, with the php:
$(function() {
var date = new Date(<?php echo strtotime($date); ?>);
$("#date").datepicker();
$("#date").datepicker("setDate", date);
$("#date").datepicker( "option", "showAnim", "slideDown" );
});
The date has inconsistent values when done like this, the date will always be wrong no matter what date you set, but there is no pattern.
$(function() {
var date = new Date(2015, 10, 15);
$("#date").datepicker();
$("#date").datepicker("setDate", date);
$("#date").datepicker( "option", "showAnim", "slideDown" );
});
The Javascript Date object's constructor takes milliseconds when given only one argument.
The PHP function strtotime() returns the Unix Timestamp, the number of seconds since 1970-01-01.
If you multiply the timestamp by 1,000, you'll get a suitable value to pass to the Date constructor.
var date = new Date(<?php echo (strtotime($date) * 1000); ?>);
I had also tried it like this previously, but forgot to put quotation marks around the php. Now it works:
<script>
$(function() {
$("#date").datepicker();
$("#date").datepicker("setDate", "<?php echo $date ?>");
$("#date").datepicker( "option", "showAnim", "slideDown" );
});
</script>
Related
my jquery datepicker shows date correctly but the time isn't working. the test result produces the following: 1372046400 = 2013-06-24 04:06:00
as you can see the time isnt same as the systemtime, it should be 8:19pm.
<script type="text/javascript">
$(document).ready(function(){
$("#date").datepicker({
showButtonPanel: true,
minDate: '0M',
maxDate: '+90D',
dateFormat: "d-MM-yy",
onSelect : function(dateText, inst)
{ var epoch = $.datepicker.formatDate('#', $(this).datepicker('getDate')) / 1000;
$('#hidden1').val(epoch);
}
});
});
</script>
php script that displays the output
$dateTime = $_POST['hidden1'];
$date = new DateTime('#'.$dateTime);
echo $saveDate = $date->format('U = Y-m-d h:m:s');
http://php.net/manual/en/function.date.php
it has to be
$date->format('U = "Y-m-d H:i:s');
m is for month
set your time zone (http://php.net/manual/en/function.date-default-timezone-set.php) and then try to use the answer that Sanath has suggested.
Example:-
date_default_timezone_set('America/Los_Angeles');
basically I know more or less how to do it but would like to know if there is any better way?
I have the following variables in PHP
$day; $month; $year;
The ones above have values from exploding a php date string.
Below is PHP plugin function which states the date for countdown.
<script type="text/javascript">
$(function () {
var austDay = new Date();
austDay = new Date(2013, 12, 22);
$('#defaultCountdown').countdown({until: austDay});
});
</script>
I would like to pass the date day/month/year variables into that function from PHP
how can I do it, when I tried to attach to the javavariable and put that variable in place of the date part, it didnt work.
Thanks for all help
var day = <?php echo $day ?>;
var month = <?php echo $month ?>;
var year = <?php echo $year ?>;
$(function () {
var austDay = new Date();
austDay = new Date( year, month, day );
$('#defaultCountdown').countdown({until: austDay});
});
There's a couple of ways you could skin this.
Fetch the values via $.ajax with php returning the values as a jsonified array (echo json_encode($my_values))
If the page generating the html is a php page then just new Date();
Place the values into hidden form fields anywhere on the page or into data-day, data-month, data-year attributes of a relevant object on the page and fetch the values using jquery
day = $('#hiddenfield_day').val(); //put the var day into the day field of new date, etc
Hope this helps.
Change this line:
austDay = new Date(<?= $year ?>, <?= $month ?> , <?= $day ?>);
That said, keep in mind that Javascript's new Date() month param takes a number in the 0 - 11 range.
I have some php which queries a database to get some dates:
<?php
//connect to db etc
$sql="SELECT date FROM entries ORDER BY date ASC";
$result = mysql_query($sql);
if($result){
$entryDates = array();
while ($row=mysql_fetch_array($result)) {
$entryDates[] = $row['date'];
}
$minDate = explode("-", $entryDates[0]);
$minDate[1] -= 1;
$maxDate = explode("-", end($entryDates));
$maxDate[1] -= 1;
echo($maxDate[1]);
}
?>
I then try and assign the min and max dates to a uidatepicker using jquery.
Originally I did this and it worked:
var theDate = new Date();
$( "#datepicker" ).datepicker(
{
dateFormat: 'dd-mm-yy',
maxDate: new Date(theDate.getFullYear(), theDate.getMonth(), theDate.getDate())
}
)
However trying to implement the same using the php vars doesn't work:
$( "#datepicker" ).datepicker(
{
dateFormat: 'dd-mm-yy',
maxDate: new Date(<?php echo($maxDate[2]);?>,<?php echo($maxDate[1]);?>,<?php echo($maxDate[0]); ?>)
minDate: new Date(<?php echo($minDate[2]);?>,<?php echo($minDate[1]);?>,<?php echo($minDate[0]); ?>)
}
);
I am trying to use the following date constructor:
new Date(year, month, day, hours, minutes, seconds, milliseconds)
$minDate and $maxDate are arrays that look something like
[yyyy|mm|dd]
When echoing them they contain the correct values..so the issue lies within jQuery...probably the way I am trying to create a Date...but what exactly is wrong with my syntax? I cannot see what I am doing wrong...
Your array data is probably being placed into the javascript Date() constructor in the wrong order. Assuming your date strings are in the format YYYY-MM-DD and you print_r() your $maxdate array you should see something like this:
Array
(
[0] => 2011
[1] => 0
[2] => 01
)
Notice that this array's indices are in the order 0=>year, 1=>month, 2=>day. So you need to modify your Date() constructors to align those values with the constructors input parameters like this:
<script type="text/javascript">
$( "#datepicker" ).datepicker({
dateFormat: 'dd-mm-yy',
maxDate: new Date(<?php echo($maxDate[0]);?>,<?php echo($maxDate[1]);?>,<?php echo($maxDate[2]); ?>),
minDate: new Date(<?php echo($minDate[0]);?>,<?php echo($minDate[1]);?>,<?php echo($minDate[2]); ?>)
});
</script>
Once the user has selected the date from the datepicker, i want to add 41 days.
<script language="javascript">
$(document).ready(function() {
$("#startdate").datepicker({ dateFormat: 'd/m/y'});
$('#startdate').datepicker({
onSelect: function(dateStr) {
var nights = parseInt($('#numofdays').val());
var depart = $.datepicker.parseDate('d/m/y', dateStr);
depart.setDate(depart.getDate('d/m/y') + nights);
$('#calc').val(depart);
}
});
});
</script>
Start: <input type="text" id="startdate" class="datepicker"><br />
<input type="hidden" id="numofdays" value="41"><br />
Calc: <input type="text" id="calc">
You might just need to combine the options in the same initiating function:
$("#startdate").datepicker({
dateFormat: 'd/m/y',
onSelect: function(dateStr, inst) {
var nights = parseInt($('#numofdays').val());
var depart = $.datepicker.parseDate('d/m/y', dateStr);
depart.setDate(depart.getDate('d/m/y') + nights);
$('#calc').val(depart.toLocaleDateString());
}
});
See this in action: http://jsfiddle.net/william/L9Szd/.
$('#startdate').datepicker('getDate') will return a Date object
d = $('#startdate').datepicker('getDate');
d.setDate(d.getDate()+nights); // add int nights to int date
alert(d);
Adding d.getDate() and nights will jump time forward. So if 9/16/2011 + 41 days you'll get 10/25/2011
would seem strange as a user to select a date, and then the box says a date that's 41 days later instead of the one I picked. why not do this addition server side with PHP?
$date_string = date('Y-m-d', strtotime('+41 days', strtotime($_POST['date_input'])));
This is the only simple way I found to do this:
To set date to 41 days ahead of the selected date:
1.Fetch selected date from a datepicker field
var newdate = new Date($("#datepicker_date_field_1").datepicker("getDate"));
2.Increase the date got from above
newdate.setDate(newdate.getDate() + 41);
3.Assign the newly formed date to another (or same) datepicker field
$("#datepicker_date_field_2").datepicker("setDate",newdate);
I try to modify the keith-wood countdown timer to accept a future unix timestamp and hide the days.
To hide the days you use $('#noDays').countdown({until: liftoffTime, format: 'HMS'}); as the example at http://keith-wood.name/countdown.html under the tab Formats1 says.
I didn't manage yet to make it work. How to modify the code to get a unix timestamp as input and hide the days?
Standard timer
<script type="text/javascript">
$(function () {
var austDay = new Date();
austDay = new Date(austDay.getFullYear() + 1, 1 - 1, 26);
$('#defaultCountdown').countdown({until: austDay});
$('#year').text(austDay.getFullYear());
});
</script>
My try to have as input a unix timestamp (does not work)
<script type="text/javascript">
$(function () {
var austDay = new Date();
austDay = new Date(<?php echo $unixtimestamp; ?>*1000);
$('#defaultCountdown').countdown({until: austDay});
$('#year').text(austDay.getFullYear());
});
</script>
You can use the setTime() function:
var austDay = new Date();
austDay.setTime(<?php echo $unixtimestamp * 1000; ?>);
Edit: added * 1000 to go from unix timestamp to javascript timestamp...