jQuery: having trouble specifying minDate and maxDate for a datePicker
I'm trying to enforce choosing only dates between (today minus a week, today plus a week) but instead getting a datePicker with past dates disabled and unrestricted future dates.
Any idea? (I'm new to jQuery, 2nd day of playing with it...) thanks!
I isolated the code to clearly repro it:
<html>
<head>
<title>jquery sample</title>
<script type="text/javascript" src="jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="date.js"></script>
<script type="text/javascript" src="jquery.datePicker.js"></script>
<link href="datePicker.css" rel="stylesheet" type="text/css" />
<link href="custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" charset="utf-8">
$(function () {
$('.date-pick').datePicker({ minDate: 开发者_如何转开发'-7D', maxDate: '+7D' }).val(new Date().asString()).trigger('change');
});
</script>
</head>
<body>
<a href="">Link</a>
<input name="date1" id="date1" class="date-pick" />
</body>
The options are different for your current plugin, startDate
and endDate
and they must be strings, like this:
$(function () {
$('.date-pick').datePicker({
startDate : new Date().addDays(-7).asString(),
endDate: new Date().addDays(7).asString()
}).val(new Date().asString()).trigger('change');
});
You can give it a try here. The documentation you seemed to have pulled from is for a different plugin, the jQuery UI Datepicker found here.
It looks like you're mixing up the same two datepickers that I did, as @Nick pointed out. The datepicker plugin you're using doesn't take minDate
and maxDate
options: http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/documentation.html
But the jQuery UI datepicker does. http://jqueryui.com/demos/datepicker/#option-minDate
Which one did you mean to use? If it's the plugin (not the jQuery UI one), then use the startDate
and endDate
options (looks like they only accept absolute-date strings [kind of crappy, IMO]):
$(function() {
var MS_PER_WEEK = 604800000;
now = new Date().getTime(),
start = new Date(now - MS_PER_WEEK),
end = new Date(now + MS_PER_WEEK),
startStr = start.getDate() + '/' + (start.getMonth() + 1) + '/' + start.getFullYear(),
endStr = end.getDate() + '/' + (end.getMonth() + 1) + '/' + end.getFullYear()
$('.date-pick').datePicker({
startDate: startStr
endDate: endStr
}).val(new Date().asString()).trigger('change');
});
For the jQuery UI datepicker, try a lowercase d
to indicate days:
$(function() {
$('.date-pick').datepicker({
minDate: '-7d',
maxDate: '+7d'
}).val(new Date().asString()).trigger('change');
});
I think you need to use startDate and endDate instead:
$('.date-pick').datePicker({ startDate: '-2D', endDate: '+2D' }).val(new Date().asString()).trigger('change');
That is, assuming you are using the plugin described here: kevinluck.com. This works for me on my local test. I assume you are using this plugin due to the similarity to the examples on Kevin's site.
精彩评论