Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Handling 2-digit dates in DatePicker examples #1463

Open
carmacleod opened this issue Jul 23, 2020 · 0 comments
Open

Handling 2-digit dates in DatePicker examples #1463

carmacleod opened this issue Jul 23, 2020 · 0 comments

Comments

@carmacleod
Copy link
Contributor

If a user types a 2-digit year which is then passed in to new Date(), Javascript creates a Date in the 1900's.
Seriously. It's even written into the doc for the Date constructor:

Values from 0 to 99 map to the years 1900 to 1999. All other values are the actual year.

For example, 04/19/09 turns into April 19, 1909.
Since it's 2020 today and 1909 is a long time ago, my assumption was that the DatePicker example should move all 2-digit dates into the 2000's, and @jongund added some logic to do that in #1362 (Thank-you, Jon).

However, what if today's user types 99? I wonder if they are more likely to be thinking about 1999 than 2099?

Spitballing, perhaps a typical user in a typical app might expect a 2-digit year to end up somewhere between 80 years into the past (i.e. birthdays, historic events) and 20 years into the future (i.e. medium to long-term planning)?
Obviously, though, it depends on the app. If the question is "When were you born?", then future dates are not useful. If the question is "When do you plan to travel?", then past dates don't make sense.

For the APG's DatePicker example, however, something like the following might be generically useful (this implements the 80/20 logic explained above, and it is future-proof, i.e. I tested it with thisYear set to some future years as well):

DatePickerDialog.prototype.getDateFromTextbox = function () {

  var parts = this.textboxNode.value.split('/');
  var month = parseInt(parts[0]);
  var day = parseInt(parts[1]);
  var year = parseInt(parts[2]);
  var today = new Date();

  if ((parts.length === 3) &&
      Number.isInteger(month) &&
      Number.isInteger(day) &&
      Number.isInteger(year)) {
    if (year < 100) {
      // calculate fallback value for 2-digit year
      var thisYear = today.getFullYear();
      var thisCentury = Math.trunc(thisYear / 100) * 100;
      year = thisCentury + year; // start in this century
      if (year > thisYear + 20) {
        // if more than 20 years in the future, assume user meant last century
        year = year - 100;
      } else if (year <= thisYear - 80) {
        // if more than 80 years in the past, assume user meant next century
        year = year + 100;
      }
    }
    this.focusDay = new Date(year, month-1, day);
    this.selectedDay = new Date(this.focusDay);
  }
  else {
    // If not a valid date (MM/DD/YYYY or YY) initialize with today's date
    this.focusDay = today;
    this.selectedDay = new Date(0,0,1);
  }

};

Low priority to fix this - I just wanted to make a note of it in case anyone trips over it.
If folks agree with the logic, I could create a PR.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant