If/Else Not Working

Hi,

I have a site where I want people to choose the number of guests they would like to invite to an event from a drop down, and based on their guest number selection the corresponding fields will appear. I.e. choose 1 guest and set of 7 fields to complete for that guest will appear, choose two guests and two sets of 7 fields to complete appear, etc. They have the option to invite 5 guests. And for each guest they have to complete these 7 fields. But I only want what they have to complete to appear so it is not confusing.

I have grouped my fields so rather than having to code for 7 fields to appear each time, I only have to code for a group to appear.

This is my code:
export function dropdown1_onChange(event, $w) {
if (event.target.value === ‘1’) {
$w(" #group1 “).show();
$w(” #group2 “).hide();
$w(” #group3 “).hide();
$w(” #group4 “).hide();
$w(” #group5 “).hide();
}
else if (event.target.value === “2”) {
$w(” #group1 “).show();
$w(” #group2 “).show();
$w(” #group3 “).hide();
$w(” #group4 “).hide();
$w(” #group5 “).hide();
}
else if (event.target.value === “3”) {
$w(” #group1 “).show();
$w(” #group2 “).show();
$w(” #group3 “).show();
$w(” #group4 “).hide();
$w(” #group5 “).hide();
}
else if (event.target.value === “4”) {
$w(” #group1 “).show();
$w(” #group2 “).show();
$w(” #group3 “).show();
$w(” #group5 “).show();
$w(” #group5 “).hide();
}
else if (event.target.value === “5”) {
$w(” #group1 “).show();
$w(” #group2 “).show();
$w(” #group3 “).show();
$w(” #group4 “).show();
$w(” #group5 ").show();
}
}

I have seen directed in another post the below items, which I have also done:
Set the 7 x individual elements/fields of each group so that they are enabled by default to show on the page, however the group as a whole is to be set as hidden on page on load

But I cannot get the code to work? Can someone please help me? I am really stuck and need this to work ASAP.

Thanks!!!

Kym,

Wix is not recognizing this export function. When added from the properties toolbar by clicking the “+” next to onChange, thereby creating an export function, one is creating the function name that Wix recognizes as the export function name for the change event of that particular dropdown.

If you add it from the property sheet, it would say “change” instead of “onChange” and look like the following:

So, when adding through the properties toolbar, it will add a new code block, and that is now the “registered” export function name for the onChange event for that dropdown.

Thanks Anthony! Thats great!!

It worked ALMOST perfectly… So it works for the first 4 groups, but when I select 5 guests, all five groups should show, but only the first 4 show. Do you know how I would fix that, this is my code for the 5 guest selection:

else if (event.target.value === “5”) {
$w (“#group1”).show();
$w (“#group2”).show();
$w (“#group3”).show();
$w (“#group4”).show();
$w (“#group5”).show();
}
}

@kymgeikie The code looks fine. Be sure that the “Collapsed on Load” checkbox is not checked for that grouping and that the name is in all lower case as your code expects it to be. Other than that, not knowing everything that’s going on with your form, I don’t have any suggestions of what to check.

@tony-brunsman Thanks. I have checked that, and it is not checked. And all the permissions etc are the same as the other groups, so I am not sure why it will not. Thanks for your help.

@kymgeikie I thought of one more thing that would cause the grouping not to show as you expected. Check that the individual elements in that grouping have Collapsed on Load and Hidden on Load unchecked.

@tony-brunsman Thanks Anthony, your help is much appreciated, it is all working now!