Need help adjusting conditions to hide/unhide an element

[sydneyng]

Hi, I’m building a booking website and there’s 2 ways in which a user can make a reservation: 1. website, 2. email, so I created a link element for each booking option and would like to hide whichever reservation method is not being used–but i’m having trouble doing this.

For example, there’s 2 link elements on the page, and I’ve created conditions for each to show/not show based off what’s inputted into the data field.

Data type’s backend, which is what’s used in my conditions:

Conditions of each link:

1. Website (ignore 2nd condition in this pic)
   

   

2. Email
   

   

I thought the settings of my conditions were correct, but the element cannot seem to read the “@” character that’s stored within a store’s email address. For example, this store accepts reservations via email (ron@gmail.com), but the ‘Book with Website’ link still shows. I need only the ‘Book with Email’ link to show.

Backend:

Frontend:

All help would be greatly appreciated, thanks!

[blurapps]

The links may have the ‘visible on page load’ property checked.
This is the default - meaning that if neither of your conditions are met, the visibility of the element is determined by this. I’d recommend keeping it unchecked and providing the conditions when the link element should be visible.

Regarding detecting an email, there are ways to do that built into Bubble. One way is by using the :extract option on the email value. I’d do something like this to check if the email is valid since it involves checking for ‘@’ and other email identifiers at the backend:

Condition: User's email :extract Domain is empty
This being ‘yes’ would imply an invalid email and ‘no’ would imply a valid email.

Hope that helps

Ranjit | Blur Apps

[sydneyng]

Worked perfectly, thank you!