In the JS flow, we disable the family member textarea, which means you can't accidentally enter family members names into it without clicking the checkbox. It's also visually de-emphasized, so we're pretty confident that if someone has something left in the textarea but they uncheck the box, they don't want to rebook their family members. So in the JS case, we erase their familyOption value if familyCheck is missing.
textarea empty
textarea has a value
checkbox not checked □
👍
👍
checkbox checked ✓
🛑
👍
NoJS validation
In the NoJS flow, we have to keep the textarea enabled, so people are able to enter family members in, although they won't be saved unless the checkbox is clicked as well.
Instead of silently deleting user data if they haven't checked the checkbox, we want to validate them on the noJS flow if they've entered family members but not clicked the checkbox.
JS validation
In the JS flow, we disable the family member textarea, which means you can't accidentally enter family members names into it without clicking the checkbox. It's also visually de-emphasized, so we're pretty confident that if someone has something left in the textarea but they uncheck the box, they don't want to rebook their family members. So in the JS case, we erase their
familyOption
value iffamilyCheck
is missing.NoJS validation
In the NoJS flow, we have to keep the textarea enabled, so people are able to enter family members in, although they won't be saved unless the checkbox is clicked as well.
Instead of silently deleting user data if they haven't checked the checkbox, we want to validate them on the noJS flow if they've entered family members but not clicked the checkbox.
Gifs