[New Feature] Custom error handlers for elements

We’ve added a new event type, “An element had an error running a workflow”.

As you probably know, when an error happens in a user-interaction-initiated workflow (clicking a button, changing an input, etc), we pop up an alert with the error message.

This isn’t always the greatest user experience. Sometimes you might want to give the user the option to retry, take them back to a previous page, show a link to ask for help, etc. Or maybe you want to show the same error message, but show it in a nicely-formatted alert that matches your app’s branding rather than show it in the browser-default alert popup.

This event lets you do that. You can create one or more such events per per element, and set conditions on them based on the state of the page and the error code that occurred. If any of the conditions pass, then the default error alert will not be shown; instead, your workflow(s) will run.

More information here: https://bubble.io/reference#Events.ButtonClicked

23 Likes

Awesome! Needed this

1 Like

Very nice!

Keep up the good work Bubble team. With every improvement you are increasing engagement and loyalty!!

2 Likes

Excellent! good work!

@josh

I’ve read this thread and the link provided…

I am trying to implement this to a button I have that when clicked it collects user’s CC info, I then want to catch the “we’ve successfully got your details” message and reformat that a bit more nicely.

I can not see it in the list below when creating a new Event.

nor can I can see it under the elements actions (see below) - need some help please? :slight_smile:

Hey Rogelio, unfortunately it won’t work for that – it only handles error messages, not success messages. We can look into creating an option to disable that popup and let you replace it with your own messaging.

Anyway as far as not finding the event, it should have showed up in your first screenshot… try refreshing the browser window, and if it’s still not there, send us an email at support@bubble.is with the name of the app you’re not seeing it on.

Bummer. It would be nice for it to handle all messages, otherwise the interaction isn’t consistent.

We’ll add that soon (a way to suppress messages when it’s successful). A few days away.

1 Like

We just added the ability to remove the alerts when an operation succeeds (so far we’ve covered Stripe and Braintree, let us know if you see other actions that should have that).

5 Likes

has anyone implemented the successful operation alert handling that could explain how this is achieved?

thanks

Just check the box at the stripe action level (like charge the current user, etc). You’ll see the option at the bottom of the property editor.

excellent - thanks @emmanuel

@josh

is there a list of error codes available somewhere to be able to use in error handling workflows?

thanks

Good question. We’re going to add this to the Settings -> Language tab in a bit, but for now, here’s the current list to get you started. The codes are things like DO_NOT_MATCH, and then the description next to them gives more context on what the codes mean (it matches the description on the Settings -> Language tab).

    LOADING: "Loading message"
    DO_NOT_MATCH: "When two passwords don't match"
    UPDATE_CREDENTIAL_SUCCESS: "When the user's credentials are successfully updated"
    NEED_TO_BE_LOGGED_IN: "When the user should be logged in to modify her crendentials"
    NOT_VALID_EMAIL: "When the email isn't valid"
    NO_EMAIL: 'When the email is missing'
    NO_PASSWORD: 'When the password is missing'
    NO_SUCH_USER: "When the user can't be found"
    WRONG_PASSWORD: "When the password is incorrect"
    PASSWORD_INVALID: "When the password doesn't meet the password policy"
    USED_EMAIL: "When the email is already used"
    NO_USER_TEMP_PW: "When no user to set a temporary password to"
    CONF_EMAIL_SUBJECT: 'Email confirmation subject'
    CONF_EMAIL_BODY: "Email confirmation body"
    ISSUE_CONF_EMAIL: "When there is an issue confirming an email"
    ENTER_OLD_PW: "When prompting the user to enter her old password"
    WRONG_OLD_PW: "When the former password isn't correct"
    NEED_NEW_PW: "When prompting the user to enter a new password"
    WRONG_PASSWORD_RESET: "When the password link is corrupted"
    MISSING_INFO: 'When some information is missing to execute an action'
    SELECT_FILE: "When the user didn't provide a file to upload"
    PRIVATE_FILE: "When user uploads a private file, without an objected attached to it"
    OAUTH_ISSUE: "When there is an issue with Oauth login"
    TRY_AGAIN: "When the user should try again"
    TEMPORARY_BUG: "When a temporary bug happens"
    BAD_REVISION: 'When the app has been updated and the user should refresh'
    BAD_REVISION_PHONE: 'When the app has been updated and the user should refresh (phone)'
    STILL_CHANGING: 'When the page changes before all changes are saved'
    NO_PERMISSION: 'When the user does not have the permission to modify or see some data'
    EXPIRED_SESSION: 'When the session of the current user has expired'
2 Likes

thanks @josh

@josh The “email is already in used” error is returning the incorrect code.

Oops, thanks for catching that… it was showing as “MICELLANEOUS” instead of “USED_EMAIL”. I’m deploying a fix now – it should be back to “USED_EMAIL” in an hour or so.

thanks @josh - can confirm that its working now.

I’m still having a hard time setting up a “wrong email/password” alert on my log in page. Can anyone give a bit more clarity on how to set up an error message? Thanks!! Bubble ON