library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Datepicker. Fixed #3657 showOtherMonths should allow the selection of days from other months

Browse Source
This commit is contained in:
Keith Wood 2009-06-21 07:28:51 +00:00
parent 82df8dbf53
commit 3b5c91fdc6
4 changed files with 60 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
demos/datepicker/index.html
View File

@ -17,6 +17,7 @@
<li><a href="inline.html">Display inline</a></li>
<li><a href="buttonbar.html">Display button bar</a></li>
<li><a href="dropdown-month-year.html">Display month &amp; year menus</a></li>
<li><a href="other-months.html">Dates in other months</a></li>
<li><a href="multiple-calendars.html">Display multiple months</a></li>
<li><a href="icon-trigger.html">Icon trigger</a></li>
<li><a href="event-search.html">Event Search</a></li>

32
demos/datepicker/other-months.html Normal file
View File

@ -0,0 +1,32 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Datepicker - Dates in other months</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../ui/ui.datepicker.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker({showOtherMonths: true, selectOtherMonths: true});
});
</script>
</head>
<body>
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo -->
<div class="demo-description">
<p>The datepicker can show dates that come from other than the main month
being displayed. These other dates can also be made selectable.</p>
</div><!-- End demo-description -->
</body>
</html>

21
tests/unit/datepicker/datepicker_options.js
View File

@ -136,6 +136,27 @@ test('invocation', function() {
inp.datepicker('hide').datepicker('destroy');
});
test('otherMonths', function() {
var inp = init('#inp');
var pop = $('#ui-datepicker-div');
inp.val('06/01/2009').datepicker('show');
equals(pop.find('tbody').text(), '\u00a0123456789101112131415161718192021222324252627282930\u00a0\u00a0\u00a0\u00a0',
'Other months - none');
ok(pop.find('td:last *').length == 0, 'Other months - no content');
inp.datepicker('hide').datepicker('option', 'showOtherMonths', true).datepicker('show');
equals(pop.find('tbody').text(), '311234567891011121314151617181920212223242526272829301234',
'Other months - show');
ok(pop.find('td:last span').length == 1, 'Other months - span content');
inp.datepicker('hide').datepicker('option', 'selectOtherMonths', true).datepicker('show');
equals(pop.find('tbody').text(), '311234567891011121314151617181920212223242526272829301234',
'Other months - select');
ok(pop.find('td:last a').length == 1, 'Other months - link content');
inp.datepicker('hide').datepicker('option', 'showOtherMonths', false).datepicker('show');
equals(pop.find('tbody').text(), '\u00a0123456789101112131415161718192021222324252627282930\u00a0\u00a0\u00a0\u00a0',
'Other months - none');
ok(pop.find('td:last *').length == 0, 'Other months - no content');
});
test('defaultDate', function() {
var inp = init('#inp');
var date = new Date();

9
ui/ui.datepicker.js
View File

@ -76,6 +76,7 @@ function Datepicker() {
yearRange: '-10:+10', // Range of years to display in drop-down,
// either relative to current year (-nn:+nn) or absolute (nnnn:nnnn)
showOtherMonths: false, // True to show dates in other months, false to leave blank
selectOtherMonths: false, // True to allow selection of dates in other months, false for unselectable
calculateWeek: this.iso8601Week, // How to calculate the week of the year,
// takes a Date and returns the number of the week for it
shortYearCutoff: '+10', // Short year values < this are in the current century,
@ -1340,6 +1341,7 @@ $.extend(Datepicker.prototype, {
var monthNamesShort = this._get(inst, 'monthNamesShort');
var beforeShowDay = this._get(inst, 'beforeShowDay');
var showOtherMonths = this._get(inst, 'showOtherMonths');
var selectOtherMonths = this._get(inst, 'selectOtherMonths');
var calculateWeek = this._get(inst, 'calculateWeek') || this.iso8601Week;
var defaultDate = this._getDefaultDate(inst);
var html = '';
@ -1385,7 +1387,7 @@ $.extend(Datepicker.prototype, {
var daySettings = (beforeShowDay ?
beforeShowDay.apply((inst.input ? inst.input[0] : null), [printDate]) : [true, '']);
var otherMonth = (printDate.getMonth() != drawMonth);
var unselectable = otherMonth || !daySettings[0] ||
var unselectable = (otherMonth && !selectOtherMonths) || !daySettings[0] ||
(minDate && printDate < minDate) || (maxDate && printDate > maxDate);
tbody += '<td class="' +
((dow + firstDay + 6) % 7 >= 5 ? ' ui-datepicker-week-end' : '') + // highlight weekends
@ -1401,11 +1403,12 @@ $.extend(Datepicker.prototype, {
((!otherMonth || showOtherMonths) && daySettings[2] ? ' title="' + daySettings[2] + '"' : '') + // cell title
(unselectable ? '' : ' onclick="DP_jQuery.datepicker._selectDay(\'#' +
inst.id + '\',' + drawMonth + ',' + drawYear + ', this);return false;"') + '>' + // actions
(otherMonth ? (showOtherMonths ? printDate.getDate() : '&#xa0;') : // display for other months
(otherMonth && !showOtherMonths ? '&#xa0;' : // display for other months
(unselectable ? '<span class="ui-state-default">' + printDate.getDate() + '</span>' : '<a class="ui-state-default' +
(printDate.getTime() == today.getTime() ? ' ui-state-highlight' : '') +
(printDate.getTime() == currentDate.getTime() ? ' ui-state-active' : '') + // highlight selected day
'" href="#">' + printDate.getDate() + '</a>')) + '</td>'; // display for this month
(otherMonth ? ' ui-priority-secondary' : '') + // distinguish dates from other months
'" href="#">' + printDate.getDate() + '</a>')) + '</td>'; // display selectable date
printDate.setDate(printDate.getDate() + 1);
printDate = this._daylightSavingAdjust(printDate);
}