jquery datepicker setting days in the future

Forum Moderators: open

Message Too Old, No Replies

jquery datepicker setting days in the future

surrealillusions

4:58 pm on May 6, 2011 (gmt 0)

Hi all,

I am trying to implement this into a site:
[docs.jquery.com...]

on a form. Only thing is, I dont want the users to select any days within the next, say, 7 days, or any day in the past.

I've tried something like this, but then the popup doesn't work at all.

$( "#datechoice" ).datepicker({ minDate: new Date(+7d) });

I think, where the +7d is at the moment, it needs to be 'Date, Number, String' but...the date changes each day, and I dont know what the number or string should be.

Anyone help please?

Also, if I want to add multiple 'addons' (so to speak), I dont need to make a new line like that do I, should I do something like this?

$( "#datechoice" ).datepicker
({ minDate: new Date(+7d) }),
({ minDate: new Date(+7d) }),
({ minDate: new Date(+7d) });

For example.

Thanks :)

caribguy

6:17 pm on May 6, 2011 (gmt 0)

Here's the Date section of the JavaScript Core Reference guide:

[developer.mozilla.org...]

What happens if someone lives in a different time zone than where your server is located?

What happens if someone has the date set incorrectly on their machine?

surrealillusions

8:01 pm on May 6, 2011 (gmt 0)

I still dont get it.
I dont understand the syntax used.

In the example:
$( ".selector" ).datepicker({ minDate: new Date(2007, 1 - 1, 1) });

How do i turn that into what i need? What does the 2007, 1 -1, 1 mean? Is that the date, number, string part? And what do those mean?

The users are 99.9% UK based, but as long as they select the date they want, then I dont think having a date set incorrectly on their machine would affect it, unless theres a way of setting the current month from the server?

Fotiman

9:20 pm on May 6, 2011 (gmt 0)

Is this any more clear?


<!DOCTYPE html>
<html>
<head>
<title>Test Date</title>
</head>
<body>
<script>
var currentDate = new Date();
// getTime returns the time in millisecond format
// to calculate 7 days, start with the smallest unit and keep multiplying
// 1000ms = 1 second
// 1 second * 60 = 1 minute
// 1 minute * 60 = 1 hour
// 1 hour * 24 = 1 day
// 1 day * 7 = 7 days
var datePlus7d = new Date(currentDate.getTime() + (1000 * 60 * 60 * 24 * 7));
alert("Today is " + currentDate.toLocaleDateString() + "\n7 days from now is " + datePlus7d.toLocaleDateString());
</script>
</body>
</html>

caribguy

9:56 pm on May 6, 2011 (gmt 0)

Here's an example of how I use it:


// add Date Pickers
 if ($('.datepicker').length > 0) {
  var date_format = 'yy/mm/dd'
  var max_date = $.datepicker.parseDate(date_format, $('#latest_date').attr('value'));
  $(".datepicker").datepicker( {
   dateFormat : date_format, 
   minDate  : new Date(2011, 3, 1) ,
   beforeShowDay : $.datepicker.noWeekends,
   maxDate  : max_date
  });
 }

latest_date is the value of a hidden input field that is set by the server. Use Fotiman's excellent example to calculate the date for minDate...

surrealillusions

9:29 pm on May 7, 2011 (gmt 0)

Thanks for your help.

I've got it sorted now thanks to your code.

:)