Support

Account

Home Forums Bug Reports Submit red error messages not clear on tabbed layout

Solving

Submit red error messages not clear on tabbed layout

  • I am setting this as a “bug” as I find the problem severe enough to be that, even though you could argue it is an issue of interface design.

    Basically, when you setup a lot of fields within Tabbed ACF elements, if a user doesn’t complete any required fields within any tabs other than the first one the error message that appears upon submitting the post is completely confusing and unclear.

    The message at the top of the page may report many errors but none of them may actually be within the first visible tab. I feel that this is an important usability issue that needs addressing and as I say is like a bug. After all, if the message at the top says Validation failed. 19 required fields below are empty” and yet none of the visible fields in the 1st tab have a red highlight that simply doesn’t make sense to an end user.

    To go over in more detail…
    I have a custom post type with about 100 fields split over 8 tabs. Seeing a red box with the message “Validation failed. 19 required fields below are empty” isn’t at all clear as all the user sees are the fields in your first tab. There may be no errors there at all with them all hidden among the other tabs.

    Having thought it over I think it would be useful if the tabs themselves with error content would go red.

    Any other suggestions please do share but I would love if this could be applied soon as I am really worried my client is going to complain that the site I’m building isn’t user friendly enough due to this problem.

  • This is multiplied by having layouts within tabs that may also have validation errors. The snippet below is by no means perfect, nor certain to cover every case of layout / repeater / tab / etc, but it is a starting point that you could work with:

    jQuery(".acf-error-message").closest(".layout").find(".acf-fc-layout-handle").css("background", "red");

    You’d need to get it to fire as a part of or after the ACF validation adds the error code into page.

  • Hi @arkid77 and @idealien,

    Thanks for the bug report.

    I have raised the issue with the plugin author and this should now be in the plugin’s future development roadmap, hopefully this will be fixed soon.

Viewing 3 posts - 1 through 3 (of 3 total)

The topic ‘Submit red error messages not clear on tabbed layout’ is closed to new replies.