Expand my Community achievements bar.

Enhance your AEM Assets & Boost Your Development: [AEM Gems | June 19, 2024] Improving the Developer Experience with New APIs and Events
SOLVED

How to populate form dropdown with values depending on previous dropdown value?

Avatar

Level 6

I've got this 3 dropdown fields, month, day and year. Upon selection of a specific month the day dropdown field should be populated with exactly the number of days for that particular month. Similiary it should be accountable for leap years as well. How to do that in AEM Forms?

1 Accepted Solution

Avatar

Correct answer by
Level 6

In the code editor for day use the following logic,

 

function getDates(numberOfDays) {
var dates = [];
var toDates;
for (var i = 1; i <= numberOfDays; i++)
{
if (i < 10) {
toDates = "0" + i + "=0" + i;
dates.push(toDates);
} else {
toDates = i + "=" + i;
dates.push(toDates);
}
}
return dates;
}

if (birthMonth.value == "January" || birthMonth.value == "March" || birthMonth.value == "May" || birthMonth.value == "July" || birthMonth.value == "August" || birthMonth.value == "October" || birthMonth.value == "December") {

this.items = getDates(31);
} else if (birthMonth.value == "February") {
this.items = getDates(29);
} else {
this.items = getDates(30);
}

View solution in original post

2 Replies

Avatar

Employee Advisor

why don't you use Date Picker component?

Avatar

Correct answer by
Level 6

In the code editor for day use the following logic,

 

function getDates(numberOfDays) {
var dates = [];
var toDates;
for (var i = 1; i <= numberOfDays; i++)
{
if (i < 10) {
toDates = "0" + i + "=0" + i;
dates.push(toDates);
} else {
toDates = i + "=" + i;
dates.push(toDates);
}
}
return dates;
}

if (birthMonth.value == "January" || birthMonth.value == "March" || birthMonth.value == "May" || birthMonth.value == "July" || birthMonth.value == "August" || birthMonth.value == "October" || birthMonth.value == "December") {

this.items = getDates(31);
} else if (birthMonth.value == "February") {
this.items = getDates(29);
} else {
this.items = getDates(30);
}