Flickering of initially hidden fields

[kitzberger]

Hi,

we've noticed that fields that are initially hidden (by a hide condition) are being displayed for a short time when loading a form in the frontend and are only hidden after the 3132 request has been made and its content processed. This is confusing/irritading to some of our users.

How could this flickering of fields be reduced and the UX be improved?

It should be relatively easy to render the information gathered by ConditionController->buildConditionAction() to the fieldsets/fields markup directly so the initial loading of 3132 could even be skipped and only be performed after the first user input?

I'd like to know whether or not this sounds like a solid approach to you, before digging further into this and start working on a PR.

[Patta]

@kitzberger i can confirm this issue. we hide the initial hidden fields with css to avoid this "glitch".

You could insert the css directly into the form with a form field of type html

<style>
.powermail_fieldwrap_initialhiddenfieldmarker,
.powermail_fieldwrap_initialhiddenfield2marker
{
display: none;
}
</style>

[kitzberger]

Yup, something like that, but auto-generated. So our editors wouldn't have to think about that. Maybe a simple viewhelper that outputs that CSS?

[Patta]

that would be great indeed! (UX)

[kitzberger]

And additionally to the display:none we'd have to handle the required attribute of those fields as well... maybe more?

Since there's so much going on in PowermailConditions.js it'll be probably best to not try to re-build its logic serverside.

What about this approach:

• Render the output of ConditionsContainer into a new data-attribute of the form tag
• Replace #sendFormValuesToPowermailCond() in https://github.com/in2code-de/powermail_cond/blob/develop/Resources/Private/Build/JavaScript/PowermailConditions.js#L18 with #processActions() of said data-attribute

That way we don't need to wait for the AJAX-calls response 🤔 (but still have less flickering)

@einpraegsam?

[kitzberger]

@Patta, I've created a PR for the 10.1.x branch of this extension. I appreciate any feedback :-)