Limit the number of years shown in the dropdown menu to verify that the user is at least 18 years old

Question

Limit the number of years shown in the dropdown menu to verify that the user is at least 18 years old

I have a dropdown for selecting the year on my form, where the user will enter their date of birth.

My goal is to determine how many years I should display in the dropdown to ensure the person is at least 18 years old.

Currently, I am calculating this by subtracting 18 years from today's date, which brings me back to 1999. This way, I can confirm that the user is indeed 18 years or older.

getYears() {

    var ageRestriction: number = 18;
    var now = new Date();
    var thisDate = (now.getFullYear() - 18);

   // Now, I want to show the years before 1999 i.e 1998, 1997, 1996, 1995 etc

}

Next, I need to loop through and display 60 years prior to 1999:

1999, 1998, 1997, 1996, 1995, 1994 and so on

I'm struggling to figure out the syntax for achieving this, hence why I am asking this question.

If anyone can demonstrate how to accomplish this task or suggest a more efficient way of handling it, please feel free to share your knowledge with me :)

angular typescript

Answer 1

Answer №1

Here is the method I would personally choose to tackle this issue.

years: number[] = [];
setYears() {
    const ageRequirement = 18;
    const datetime = new Date();
    const maximumYear = (datetime.getFullYear() - ageRequirement);
    const minimumYear = (maximumYear - 61);

    for (let i = maximumYear; i >= minimumYear; i--) {
        this.years.push(i);
    }
}

There may be a more sophisticated solution available, but this one accomplishes the task at hand. My assumption is that you prefer the list to be sorted in descending order (from the most recent year to the oldest).

I hope this information proves helpful to you.

Answer 2

Here is the method I would personally choose to tackle this issue.

years: number[] = [];
setYears() {
    const ageRequirement = 18;
    const datetime = new Date();
    const maximumYear = (datetime.getFullYear() - ageRequirement);
    const minimumYear = (maximumYear - 61);

    for (let i = maximumYear; i >= minimumYear; i--) {
        this.years.push(i);
    }
}

There may be a more sophisticated solution available, but this one accomplishes the task at hand. My assumption is that you prefer the list to be sorted in descending order (from the most recent year to the oldest).

I hope this information proves helpful to you.

Limit the number of years shown in the dropdown menu to verify that the user is at least 18 years old

Answer №1

Similar questions

Issue with utilizing Lodash's _.findIndex method while installing lodash through tsd and saving it in an Angular2 project

Ways to limit the type based on the value of the argument

Tips for simulating localStorage in TypeScript unit testing

I encountered a warning while using the useViewportScroll in NextJs with Framer Motion: "Caution: The useLayoutEffect function does not have any effect on the server

Utilizing Typescript and Jest to prevent type errors in mocked functions

Issue with Angular 10: Modal window fails to open upon second click

In Angular2, you can dynamically show or hide previous and next buttons based on the contents of the first and last div

What is the best type to use for an Angular component?

Exploring the use of TypeScript and Webpack to read non-JavaScript files in Node.js

Issue with file uploading in Angular 9 as the uploaded file is not being added to the

Transform a group of objects in Typescript into a new object with a modified structure

Is Node.js and Express.js necessary when utilizing Angular2 in development?

Monitor the true/false status of each element within an array and update their styles accordingly when they are considered active

Is it possible for ngModelChange to function with a custom form control?

Error encountered due to a circular reference in the dependency library

Storing input values in the state using Typescript by default

Deactivate the input fields within a dynamic form

Is there a way to prevent Intellij from constantly compiling TypeScript at a very slow pace?

Using ngFor to iterate through an array of objects in Angular 5

Display database information on the webpage