fix(datetime): not always disabling day values when dayValues set

ionic-team · Mar 15, 2017 · eff420f · eff420f
1 parent 53feb3f
commit eff420f
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 20 deletions.
diff --git a/src/components/datetime/datetime.ts b/src/components/datetime/datetime.ts
@@ -623,28 +623,14 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces
       }
     }
 
-    // default to assuming this month has 31 days
-    let numDaysInMonth = 31;
-    let selectedMonth: number;
-    if (monthCol) {
-      monthOpt = monthCol.options[monthCol.selectedIndex];
-      if (monthOpt) {
-        // they have a selected month value
-        selectedMonth = monthOpt.value;
-
-        // calculate how many days are in this month
-        numDaysInMonth = daysInMonth(selectedMonth, selectedYear);
-      }
-    }
-
     // create sort values for the min/max datetimes
     let minCompareVal = dateDataSortValue(this._min);
     let maxCompareVal = dateDataSortValue(this._max);
 
     if (monthCol) {
       // enable/disable which months are valid
       // to show within the min/max date range
-      for (i = 0; i < monthCol.options.length; i++) {
+      for (let i = 0; i < monthCol.options.length; i++) {
         monthOpt = monthCol.options[i];
 
         // loop through each month and see if it
@@ -654,11 +640,25 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces
       }
     }
 
+    // default to assuming this month has 31 days
+    let numDaysInMonth = 31;
+    let selectedMonth: number;
+    if (monthCol) {
+      monthOpt = monthCol.options[monthCol.selectedIndex];
+      if (monthOpt) {
+        // they have a selected month value
+        selectedMonth = monthOpt.value;
+
+        // calculate how many days are in this month
+        numDaysInMonth = daysInMonth(selectedMonth, selectedYear);
+      }
+    }
+
     if (dayCol) {
       if (isPresent(selectedMonth)) {
         // enable/disable which days are valid
         // to show within the min/max date range
-        for (i = 0; i < dayCol.options.length; i++) {
+        for (let i = 0; i < dayCol.options.length; i++) {
           dayOpt = dayCol.options[i];
 
           // loop through each day and see if it
@@ -667,13 +667,14 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces
 
           dayOpt.disabled = (compareVal < minCompareVal ||
             compareVal > maxCompareVal ||
-            numDaysInMonth <= i);
+            numDaysInMonth < dayOpt.value);
         }
 
       } else {
         // enable/disable which numbers of days to show in this month
-        for (i = 0; i < dayCol.options.length; i++) {
-          dayCol.options[i].disabled = (numDaysInMonth <= i);
+        for (let i = 0; i < dayCol.options.length; i++) {
+          dayOpt = dayCol.options[i];
+          dayOpt.disabled = (numDaysInMonth < dayOpt.value);
         }
       }
     }

diff --git a/src/components/datetime/test/datetime.spec.ts b/src/components/datetime/test/datetime.spec.ts
@@ -107,7 +107,7 @@ describe('DateTime', () => {
 
     it('should enable all of the values given', () => {
       datetime.monthValues = '6,7,8';
-      datetime.dayValues = '01,02,03,04,05,06,08,09,10, 11, 12, 13, 14';
+      datetime.dayValues = '01,02,03,04,05,06,08,09,10, 11, 12, 13, 31';
       datetime.yearValues = '2014,2015';
 
       datetime.pickerFormat = 'MM DD YYYY';
@@ -121,6 +121,7 @@ describe('DateTime', () => {
       expect(columns[1].options.length).toEqual(13); // days
       expect(columns[2].options.length).toEqual(2); // years
 
+      columns[0].selectedIndex = 1; // July
       datetime.validate(picker);
 
       // Months
@@ -132,6 +133,11 @@ describe('DateTime', () => {
       for (var i = 0; i < columns[1].options.length; i++) {
         expect(columns[1].options[i].disabled).toEqual(false);
       }
+
+      columns[0].selectedIndex = 0; // June
+      datetime.validate(picker);
+
+      expect(columns[1].options[12].disabled).toEqual(true);
     });
   });