Introduction
This gform/gfcf/hide_conditions filter allows developers to add custom visibility rules for fields in conversational forms.
Usage
addFilter( 'gform/gfcf/hide_conditions', ( conditions ) => {
// Custom logic to modify hide conditions
return conditions;
} );
Common Use Cases:
- Integrating with third-party add-ons that need to hide fields.
- Implementing custom visibility logic based on state.
- Adding field-specific visibility rules.
- Creating complex visibility conditions that combine multiple factors.
Parameters
| Parameter | Type | Description |
|---|---|---|
| conditions | Function[] | Array of functions that determine whether a field should be hidden. Each function receives a field element and returns true if it should be hidden, false otherwise. |
The filter accepts an array of functions, where each function:
- Takes a field element as its argument
- Returns
trueif the field should be hidden,falseotherwise - Can access any properties or data attributes of the field element to make its decision
Examples
Add a custom hide condition.
// Add a custom hide condition
addFilter('gform/gfcf/hide_conditions', function(conditions) {
// Add a condition that hides fields with a specific data attribute
conditions.push(function(field) {
return field.dataset.customVisibility === 'hidden';
});
// Add a condition that hides fields based on a custom class
conditions.push(function(field) {
return field.classList.contains('my-custom-hidden-class');
});
// Add a condition that hides fields based on some custom state
conditions.push(function(field) {
const formState = window.myFormState;
return formState && formState.shouldHideField(field.id);
});
return conditions;
});
Since
This filter was added in Conversational Forms 1.7.0
Source Code
This filter is located in assets/js/src/theme/components/form/state.js
Notes
For the hide conditions to take effect, you must trigger the gform/conditionalLogic/applyRules/end event. This event is automatically triggered when conditional logic rules are applied, but if you’re implementing custom visibility logic, you’ll need to trigger it manually:
// Trigger the event to apply hide conditions
gform.utils.trigger( {
event: 'gform/conditionalLogic/applyRules/end',
native: false,
data: {
formId: formId, // The form ID
fields: changedFields // an array of fields that were affected and conditions should be applied to.
isInit: false
}
} );