Merge pull request uxsolutions#232 from camupod/develop

eternicode · eternicode · commit 87dcd8065b10 · 2012-12-02T14:42:19.000-05:00
daysOfWeekDisabled option/method
diff --git a/README.md b/README.md
@@ -128,6 +128,12 @@ Date.  Default: End of time
 
 The latest date that may be selected; all later dates will be disabled.
 
+### daysOfWeekDisabled
+
+String, Array.  Default: '', []
+
+Days of the week that should be disabled. Values are 0 (Sunday) to 6 (Saturday). Multiple values should be comma-separated. Example: disable weekends: `'0,6'` or `[0,6]`.
+
 ### autoclose
 
 Boolean.  Default: false
@@ -248,6 +254,21 @@ Omit endDate (or provide an otherwise falsey value) to unset the limit.
     $('#datepicker').datepicker('setEndDate');
     $('#datepicker').datepicker('setEndDate', null);
 
+### setDaysOfWeekDisabled
+
+Arguments:
+
+* daysOfWeekDisabled (String|Array)
+
+Sets the days of week that should be disabled.
+
+    $('#datepicker').datepicker('setDaysOfWeekDisabled', [0,6]);
+
+Omit daysOfWeekDisabled (or provide an otherwise falsey value) to unset the disabled days.
+
+    $('#datepicker').datepicker('setDaysOfWeekDisabled');
+    $('#datepicker').datepicker('setDaysOfWeekDisabled', null);
+
 ## Events
 
 Datepicker class exposes a few events for manipulating the dates.
diff --git a/js/bootstrap-datepicker.js b/js/bootstrap-datepicker.js
@@ -101,8 +101,10 @@
 		this.weekEnd = ((this.weekStart + 6) % 7);
 		this.startDate = -Infinity;
 		this.endDate = Infinity;
+		this.daysOfWeekDisabled = [];
 		this.setStartDate(options.startDate||this.element.data('date-startdate'));
 		this.setEndDate(options.endDate||this.element.data('date-enddate'));
+		this.setDaysOfWeekDisabled(options.daysOfWeekDisabled||this.element.data('date-days-of-week-disabled'));
 		this.fillDow();
 		this.fillMonths();
 		this.update();
@@ -252,6 +254,18 @@
 			this.updateNavArrows();
 		},
 
+		setDaysOfWeekDisabled: function(daysOfWeekDisabled){
+			this.daysOfWeekDisabled = daysOfWeekDisabled||[];
+			if (!$.isArray(this.daysOfWeekDisabled)) {
+				this.daysOfWeekDisabled = this.daysOfWeekDisabled.split(/,\s*/);
+			}
+			this.daysOfWeekDisabled = $.map(this.daysOfWeekDisabled, function (d) {
+				return parseInt(d, 10);
+			});
+			this.update();
+			this.updateNavArrows();
+		},
+
 		place: function(){
 			var zIndex = parseInt(this.element.parents().filter(function() {
 							return $(this).css('z-index') != 'auto';
@@ -344,7 +358,8 @@
 				if (prevMonth.valueOf() == currentDate) {
 					clsName += ' active';
 				}
-				if (prevMonth.valueOf() < this.startDate || prevMonth.valueOf() > this.endDate) {
+				if (prevMonth.valueOf() < this.startDate || prevMonth.valueOf() > this.endDate ||
+					this.daysOfWeekDisabled.indexOf(prevMonth.getUTCDay()) > -1) {
 					clsName += ' disabled';
 				}
 				html.push('<td class="day'+clsName+'">'+prevMonth.getUTCDate() + '</td>');
diff --git a/tests/suites/options.js b/tests/suites/options.js
@@ -262,3 +262,24 @@ test('Today Highlight: today\'s date is highlighted when not active', patch_date
         ok(!target.hasClass('today'), 'Tomorrow is not marked with "today" class');
 }));
 
+test('DaysOfWeekDisabled', function(){
+    var input = $('<input />')
+                .appendTo('#qunit-fixture')
+                .val('2012-10-26')
+                .datepicker({
+                    format: 'yyyy-mm-dd',
+                    daysOfWeekDisabled: '1,5'
+                }),
+        dp = input.data('datepicker'),
+        picker = dp.picker,
+        target;
+
+
+    input.focus();
+    target = picker.find('.datepicker-days tbody td:nth(22)');
+    ok(target.hasClass('disabled'), 'Day of week is disabled');
+    target = picker.find('.datepicker-days tbody td:nth(24)');
+    ok(!target.hasClass('disabled'), 'Day of week is enabled');
+    target = picker.find('.datepicker-days tbody td:nth(26)');
+    ok(target.hasClass('disabled'), 'Day of week is disabled');
+});
