Conditional field elements

[aurovrata]

One of the issues with the integration of the Conditional Fields for CF7 plugin is the need to add `[group/] shortcodes which are currently not very well handled by the UI and makes for messy integration.

I have been thinking that this could be better integrated by hiding and flagging the group tags within the field element while showing it in the HTML code.

So when the Conditional plugin is active, the [group/] would simply be hidden from the available tags.

A button icon on the element would enable a popup with an option to label the element as a conditional group. The condition would be flagged in the UI field element, while being shown in the HTML code.

Similarly, a condition group could be defined for a column or even a row itself.

[wiliamjk]

I just saw your message here and I thought it was super valid. I use this plugin a lot and understand the challenge.

At first glance, I would have thought of including the [group] manually as if it were another shortcode. However, from what I understand, if the [group] is placed in a row, for example, and the [group/] is placed inside another column, there is a risk of the entire layout breaking, since the <div> would be stopped, am I right?

In this case, your idea seems to me the best solution:

create a conditional option on the columns and rows edit dropdown, either selecting an existing group name (if any) or allowing a new group to be created.

This here goes well with my suggestion of settings in a modal.

I think something more or less like this:

[aurovrata]

At first glance, I would have thought of including the [group] manually as if it were another shortcode. However, from what I understand, if the [group] is placed in a row, for example, and the [group/] is placed inside another column, there is a risk of the entire layout breaking, since the

would be stopped, am I right?

indeed, but even if you add the [group] only around the cf7 shortcode tag, then the form will still show the field name/description but the field will be hidden, which is not what a user will expect. They will want to at least hide the entire column cell.

I think something more or less like this:

yes, that would work! However, the inline and 'clear on hide' settings are specific to the Conditional plugin and as such not possible to implement without a clear agreement from its author @pwkid in order to provide an api to control these and ensure they are not changed in the future

[aurovrata]

I am going to attempt to fix this next with the beta 8 release.

[aurovrata]

v5.0 Beta 8 release integrates the Conditional Fields for CF7 plugin [group] tags into the UI editor.

• Field cells (columns in rows) can now have a group tag associated with their inner HTML structure. This is indicated with a dotted border line around that cell, as well as a crossed 'eye' (visible) dashicon into the column controls.
• [group] tags added into the HTML editor are associated with the closest parent <div> in the UI editor and stripped from the code in order not to interfere with the UI layout.

[aurovrata]

The conditional settings tab has been created, it is only visible when the conditional plugin is installed,

it is available for any row/column construct. Any such construct that have a conditional group associated with it will be delaminated with a dashed border line to indicate this section on of the form is conditionally set,

In additional, individual fields can be wrapped with a group shortcode available in the

[aurovrata]

This can be tested in v5.0 beta10