Input field validation

Hi,

Where exactly are you stuck? I would need more details or access to app to check it out.
It’s quite simple once you understand the basics behind this work around.

I use the hidden/visible 1x1 button constantly when I need to fire an event from the frontend to the workflow system.

this is my app’s workflow. Actually, this is the very first thing which I am focusing to be done. I want the same red error message, which you have done above. I have also trying to create an event when the condition is true, which is in the purple color.

Please have a look on that and let me know if it is possible or not.

Thanks in advance.

Can’t access. It’s not public.

hi @romanmg how do i make the input is invalid if the user name/email is already in the database?

I was searching around on how to do this and appreciated what others had posted. I like the button approach but hidden elements do worry me a bit from a maintenance perspective so I thought I’d try to take an approach that is directly on the elements themselves.

Essentially you add Conditionals on messages within groups associated with the fields that need to be checked. I put the messages in a Group since groups can have heights collapsed when hidden so that they’ll appear only when an error occurs. Make sure the groups are not visible on page load.

Here are some screenshots of the approach.

I think it’s also important to make sure that the message doesn’t show if the value is empty since it’s annoying to see an error when you’re in the process of correcting the problem or decide to not fill out a non-required field after all.

The password field is a bit trickier because it can be “validated while typing” and the error can appear before the person has had a chance to complete the password. This is why it’s important to use “isn’t focused” in this situation as well.

To keep things neat, you might want to enclose both the error group and the input in a group of their own as well so the spacing between form elements can easily be distributed.

You could also display multiple errors on submit but I think it’s nicer to let people know something is wrong right after they enter info as opposed to waiting until the end to let them know something needs correction.

I hope that helps some bubblers.

It’s also a good idea to add html form labels that can be hidden from screen readers but that’s something I’ve addressed in another thread on accessibility. Bubble Websites and Accessibility - #14 by mrmarionoble