Formulas affecting Field Settings
We'll show you examples where formulas can be applied to change visibility, required, and more.
In this tutorial you'll learn how to:
- Change field and group visibility
- Make fields required
- Make fields disabled
- and much more...
Important: Now using Formulas V2 🆕 in 2sxc 16
Formulas V2 has intellisense, stoppability, support for promises and more.
Important: The feature "Public Use of Edit Form" is disabled
If you want this demo to run for anonymous users you would need it. Register your site on patrons.2sxc.org to get access to the feature.Try it:
This formula determines the visibility of the Description field. It only becomes visible when the Title field isn't empty.
Click on the (Σ) button above to see the edit-UI with the formula.
Formulas of FormulasBasic.Description
Setting Visible (Formula-Target: Field.Settings.Visible)
// Show the field when the title isn't empty any more
v2((data) => {
return data.Title != "";
});
Try it:
This formula determines wether the Name field is required. It becomes required if the age isn't specified.
Click on the (Σ) button above to see the edit-UI with the formula.
Formulas of FormulasRequired.Name
Field.Settings.Required (Formula-Target: Field.Settings.Required)
v2((data) => {
// If we don't have an age, make the name required
var ok = !data.Age;
return ok;
});
Try it:
This formula determines wether the ApiKeyV2 field is disabled. It becomes disabled if the UseNewFeatures field is true.
Click on the (Σ) button above to see the edit-UI with the formula.
Formulas of FormulasDisabled.ApiKeyV2
Setting Disabled (Formula-Target: Field.Settings.Disabled)
v2((data) => {
return data.UseNewFeatures == true;
});
Try it:
This formula shows a warning if a field has upper case letters, and an error if empty.
Click on the (Σ) button above to see the edit-UI with the formula.
Formulas of FormulasValidation.Title
Field.Validation (Formula-Target: Field.Validation)
v2((data, context) => {
const t = data.Title;
console.log('Title at start', t);
// Check if empty
if (t == null || (/^\s*$/).test(t))
return {
value: { severity: 'error', message: 'this needs real text'}
};
// Show warning if not all lower case
if (data.Title.toLowerCase() !== data.Title)
return { value: { severity: "warning", message: "we suggest to use lower case only."} };
return data.value;
});