Skip to main content
Error Showing Content - please login as admin for details.
Error Showing Content - please login as admin for details.

Formulas Tutorials

Tutorial Home

Formulas affecting DropDowns Options

These examples show how Formulas can modify the list of available options.

Important: The feature "Public Use of Edit Form" is disabled

The feature is needed for anonymous users to use the Edit Form. Register your site here https://patrons.2sxc.org/ to get access to the feature.

Change dropdown options: Country to Offices

    This formula changes the values in the second dropdown based on the country picked first.
    Click on the (Σ) button above to see the edit-UI with the formula.

    Formulas of FormulasDropdown.Office

    Field.Settings.DropdownValues (Formula-Target: Field.Settings.DropdownValues)

    function v1 (data, context) {
      // Start with the default list, as it could have changed
      const lines = data.default.match(/[^\r\n]+/g);
      
      // Filter and join again
      const keep = lines.filter(l => l.startsWith(data.Country));
      return keep.join('\n');
    }

    Field.Settings.Disabled (Formula-Target: Field.Settings.Disabled)

    function v1 (data, context) {
      return !data.Country;
    }

    Change dropdown options: Limited or More Options

      This formula changes the values in the second dropdown if the user wants more options.
      Click on the (Σ) button above to see the edit-UI with the formula.

      Formulas of FormulasDropdownDirections.Options

      Field.Settings.DropdownValues (Formula-Target: Field.Settings.DropdownValues)

      function v1 (data, context) {
        if (!data.FilterMainOptions) return data.default;
        const lines = data.default.split('\n');
        // only keep lines with 1 code like l,r,t etc.
        const onlyMain = lines.filter(v => v.indexOf(':') == 1);
        return onlyMain.join('\n');
      }

      Get dropdown options from WebAPI

        This is an advanced formula which will call a WebApi to get the possible values in a drop down.
        Click on the (Σ) button above to see the edit-UI with the formula.

        Formulas of FormulasDropdownWebApi.Dropdown

        Field.Settings.DropdownValues (Formula-Target: Field.Settings.DropdownValues)

        function v1 (data, context) {
          // If it has a value, keep it, don't look for another
          if (data.value) return data.value;
        
          // If data had been stored in the cache by the api-call, return it
          if (context.cache.data) return context.cache.data;
          
          // Prevent the API call from running twice
          if (context.cache.alreadyRun) return data.value;
          context.cache.alreadyRun = true;
        
          // Call the sxc web-api controller from other tutorials
          context.sxc.webApi.fetchJson('app/auto/api/formulas/OptionsFromBackend')
            .then(data => {
              console.log('got data', data);// log for demo reasons
              // The result is a dictionary, so we convert to lines
              const lines = Object.keys(data)
                .map(k => k + ":" + data[k])
                .join('\n');
              context.cache.data = lines;  // set cache for next formula cycle
              context.form.runFormulas(); // trigger the next formula cycle
            });
        }

        Source Code of /api/FormulasController.cs

        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

        // Add namespaces for security check in Oqtane & DNN despite differences in .net core/.net Framework
        // If you only target one platform, you can remove the parts you don't need
        #if NETCOREAPP
        using Microsoft.AspNetCore.Authorization; // .net core [AllowAnonymous] & [Authorize]
        using Microsoft.AspNetCore.Mvc;           // .net core [HttpGet] / [HttpPost] etc.
        #else
        using System.Web.Http;                    // .net 4.5 [AllowAnonymous] / [HttpGet]
        using DotNetNuke.Web.Api;                 // [DnnModuleAuthorize] & [ValidateAntiForgeryToken]
        #endif
        using System.Collections.Generic;          // To use the Dictionary
        
        [AllowAnonymous]                          // all commands can be accessed without a login
        public class FormulasController : Custom.Hybrid.Api14 // see https://r.2sxc.org/CustomWebApi
        {
          [HttpGet]                               // [HttpGet] says we're listening to GET requests
          public object OptionsFromBackend()
          {
            var results = new Dictionary<string, string>() {
              { "first", "First option from WebApi" },
              { "second", "Second option from WebApi"},
              { "third", "3rd option" }
            };
            return results;
          }
        
        }
        
        // The next line is for 2sxc-internal quality checks, you can ignore this
        // 2sxclint:disable:no-dnn-namespaces - 2sxclint:disable:no-web-namespace