Skip to main content
Home  › ... Razor

Formulas Tutorials

Tutorial Home › Formulas
Formulas for DropDowns
#4 Formulas for Field-Settings
Formulas for Field-Groups
Requirements
Resources

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.

Single Field visibility

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 != "";
});

    Required fields

    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;
});

      Disabled fields

      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;
});

        Warnings and Errors based on Value

        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;
});
          Formulas for DropDowns
          #4 Formulas for Field-Settings
          Formulas for Field-Groups

          Source Code of this file

          Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code

          @inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade;
<!-- unimportant stuff, hidden -->


<div @Sys.PageParts.InfoWrapper()>
  @Html.Partial("../shared/DefaultInfoSection.cshtml")
  <div @Sys.PageParts.InfoIntro()>
    <h2>Formulas affecting Field Settings</h2>
    <p>We'll show you examples where formulas can be applied to change visibility, required, and more.</p>
    <p>In this tutorial you'll learn how to:</p>
    <ul>
      <li>
        Change field and group visibility
      </li>
      <li>
        Make fields required
      </li>
      <li>
        Make fields disabled
      </li>
      <li>
        and much more...
      </li>
    </ul>
    @Html.Partial("./Part NowUsingV2.cshtml")
  </div>
</div>
@Html.Partial("../shared/WarnAnonymousIfFeatureIsOff.cshtml")






@* Errors and Warnings *@


@* Footer *@
@Html.Partial("../Shared/Layout/FooterWithSource.cshtml", new { Sys = Sys })