Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Info
Looking for a section on this page? Hover your cursor over the Table of Contents icon  to the right to quickly navigate this page. 
Panel
borderColorlightgrey
bgColor#F0F0F0
titleColorwhite
borderWidth1
titleBGColor#3C9DE2
borderStylesolid
titleOverview

This chapter contains numerous real world samples of the custom dynamic behaviors you can add to your forms and workflows. Many of the business rules described below are easily created with the Visual Rule Builder by simply selecting appropriate functions or controls from your forms/workflows using a visual wizard. Rules can still be written with JavaScript in order to build any degree of complex, powerful business logic and integrate with your Web Services and frevvo connectors.


Navigating this Page

This page is divided into the following sections. Hover your cursor over or click the Table of Contents icon  at the top right to browse to a specific section or rule example. To search the headings and content, type Ctrl-f and enter a keyword.

...

This rule makes the message control NicknameMsg visible when the user enters a value into the Nickname input text control. It also hides the message control if the user deletes the value in Nickname.

Condition Wizard

This condition makes use of the built-in function "is filled". It will run whenever the control Nickname has data entered in it.

Action Wizard

Else Action Wizard

...

You can build forms/workflows in that meet Section 508 and WCAG 2.0 accessibility standards. Accessible forms/workflows can assist users with visual and motor impairments. When the Accessible property is enabled for a form/workflow, the error, "You can't leave this empty <control name>"  displays if users move ahead from a required field without filling it. The status property for the empty control becomes invalid and sets this special error message. Normally, the status property can be used in a business rule to set (or retrieve) the error message display whenever the control's value is invalid. 

For example, let's say a form has a text control named 't', and a message control named "m". If you write a rule to update 'm' with the status of the required/invalid control 't', as shown below, the message control will show the Error Message only when an invalid value is entered. It returns a blank value if the required control was left empty.

Code Block
languagejs
titleRule Code
if(!t.valid)
  {
    m.value = t.status;
  }


Similarly, this rule will not display the "You can't leave this empty" message for a required control in a form with Accessibility enabled, because that message is not treated as the control's status. However, the following rule will fill the message control with the literal text specified here (which matches the Accessibiliy message) when the required control is left empty, and the Error Message text if it's filled with an invalid value.

...

This method is useful when you have multiple ComboBoxes and making multiple calls to the same webservice impacts performance. This simple example gets product data from the Database Connector and stores it in a hidden textArea in the form. Then a second rule parses the data and sets the ComboBox options. Please see the chapter on Reusing Dynamic Content for more details.

...

This rule will take values selected in one checkbox control and populates those as options in a second checkbox control. For example, a checkbox control (Services) displays all available services. The second checkbox (Selected Services) will display as options the values selected in Services. One scenario you might use this is to customize an employee scheduling form. In Step 1 of the workflow the Coordinator picks the offered services from the full Program Service list. In Step 2 the Employee sees only the smaller list to select from.

Code Block
titleRule Code
var opts = [''];

for (var i = 0; i < ProgramService.value.length; i++ ){
  var v = ProgramService.value[i].replace(/_/g,"  ");
  opts[i] = ProgramService[i].value + "=" + v;
}
SelectedPS.options = opts;  
var event = form.load;

...

Info
titleHow it works
Expand
titleClick to learn how it works...

Click Rule Code to view the JavaScript set by the Visual Rule Builder. Notice that, like Checkbox controls, you must reference the array position of the control's value in square brackets. In the case of a T/F there is only one array position, which is '0'.Depending on the frevvo version your T/F control was built in, you may see an index after the control name in the condition, eg. TaxExemptOrg.value[0]. The Visual Rule Builder will handle this. See Selection Controls for more details. 

Code Block
titleRule Code
var event = form.load;
if (TaxExemptOrg.value[0] === 'true') {
  TaxExemptionDocument.visible = true;
} else {
  TaxExemptionDocument.visible = false;
}

...

Info
titleHow it works
Expand
titleClick to learn how it works...

Click Rule Code to view the JavaScript set by the Visual Rule Builder. This is a very simple rule that sets the control's value.

Code Block
titleRule Code
var event = form.load;
if (Clear.clicked) {
  IAgree.value = 'false';
}

However, if you have chosen the function 'to empty' in the VRB, notice that the VRB adds an extra line to the rule code that first sets the T/F's required property to false, and then sets the value to null. This is because when the T/F control's required property is true, the unchecked state is always the 'false' value. See this documentation for more explanation of the Required (false) property.

Code Block
titleRule Code
var event = form.load;
if (Clear.clicked) {
  IAgree.required = false;
  IAgree.value = null;
}
var event = form.load; if (Agree1.value[0] === 'true') { Agreement.visible = true; } else { Agreement.visible = false; }

 Depending on the frevvo version your T/F control was built in, you may see an index after the control name in the condition, eg. TaxExemptOrg.value[0]. See Selection Controls for more details. 

Tip

The In frevvo versions pre-v10.2, the value property for a Boolean checkbox behaves behaved differently depending on whether it is was from schema or from palette. If the T/F control is from schema, you will see control.value === true in the rule when the Boolean is checked.. If the T/F control is dnd from the palette, you will see control.value[0] === 'true' in the rule when the Boolean is checked. Note the array syntax used in the rule when the T/F control comes from the Palette. Designer should be aware of this difference when manually writing JavaScript.

If you For Checkboxes (from scheme and from palette) created in v10.2+, the syntax does not require the index. The Visual Rule Builder will detect the control type and write the code correctly, so if you use the Rule Builder, this difference will be seamless to the designer.

For example, the rule for a Boolean control from schema generated by the Rule Builder looks like this

Code Block
titleRule Code
var event = form.load;
if (Agree1.value === true) {
  Agreement.visible = true;
} else {
  Agreement.visible = false;
}

And the code for a Boolean control from the palette, looks like this. .

Code Block
titleRule Code

Date and Time Controls

Excerpt

Working with dates and times is very common in most forms. Some common scenarios are:

  • Populate a Date control with Today's date when the form/workflow loads
  • Populate a Date control when the user signs
  • Show the Date and Time of a Sales Order
  • Create a Date Time Stamp
  • Calculate the Number of Days between two dates

The samples below show you how to create the most common business logic with dates and times. 

Working with Date and Time Rules

Info
  •  dates can be set in the user's local time zone by using the built-in date, time and date/time methods such as frevvo.currentDateTime(). See Built-in Methods for a complete method list. If you use the base JavaScript date object you will get the UTC time zone.
  • Many of the samples below use the JavaScript Date() object. Since business rules run on the form server these dates will be in the time zone where the form server was installed. There are techniques below to convert to different timezones as you need.
  • The Date/Time control uses a "T" to separate the date and time when initializing from a business rule. For example, the syntax shown below will initialize a Date/Time control named DtTm to May 15, 2012 at 4:20 am.

    DtTm.value = "5/15/2012T4:20";

A Date or Date/Time control can be converted to a js Date object: 

Code Block
var date = new Date(Field.value);

A Time field can be converted to a js Date object:

Code Block
var time = new Date('1970-01-01T'+Field.value);

Date controls will successfully initialize via a rule or an xml document when the data provided has a single digit for the month and/or the day, however Date/Time controls must have a 2-digit month and day.  The rule below can be used to initialize a form with a date and date/time control.  

Code Block
if(form.load)
{
// Date control may have a single digit for the month and/or day
Date.value = "2020-7-1";
// DateTime control must have a double digit month and day
Date_Time.value = "2020-07-01T20:20:20";
}

The Date/Time control will display an "Invalid Value" error if single digits for the month and/or day are used .


Info

Date and Time functions typically run in the user's browser time zone. See the Time Zones and Business Rules documentation for more details.

...

Calculating a date based on a five day work week is a common business scenario used in time sheets and displaying deadlines. You can calculate 'x' number of working days from the current date, and set that date in a Date control on your form. Here is the business rule that will add 3 working days to the current date to give you the deadline date. Copy/paste the entire rule including the function in the Rule Editor. Substitute the name of your date control for <your date control>:

Code Block
titleRule Code
 function calcWorkingDays(fromDate, days) {
    var count = 0;
    while (count < days) {
        fromDate.setDate(fromDate.getDate() + 1);
      if (fromDate.getDay() !== 0 && fromDate.getDay() !== 6) {  // Skip weekends
            count++;
      }
    }
    return fromDate;
}
 
if (form.load && <your date control>.value.length === 0){
  var numWorkingDays = 3; 
  var today = frevvo.currentDate().split('-');
  var escDate = calcWorkingDays(new Date(today[0], today[1]-1, today[2]), numWorkingDays);
  var m = escDate.getMonth() + 1;
  var d = escDate.getDate();
  var y = escDate.getFullYear();
  <your date control>.value = m + '-' + d + '-' + y;
}

...

You can use a business rule to set a Repeat or Table's min and max properties based on data entered at run time. Imagine an airline reservation form where the number of traveler information sections/rows displayed is based on the number of travelers. This example form has a field labeled Number of Travelers, named 'count', and a repeat named 'TravelRepeat' with a Traveler Info section. You can leave the default values for the Min/Max properties of the Section in the Forms designer or set them to any values provided the min value < max value and the max value  > min value.


This business rule displays numbered sections based on the number of travelers. 

Code Block
titleRule Code
var i;
if (TravelRepeat.itemAdded) {
    i = TravelRepeat.itemIndex;
    TravelNo[i].value = 1 + i;
} else {
    if (count.value > TravelNo.value.length){
        TravelRepeat.maxOccurs = count.value;
        TravelRepeat.minOccurs = count.value;
    } else {
        TravelRepeat.minOccurs = count.value;
        TravelRepeat.maxOccurs = count.value;
    }
    for (i=0; i<TravelNo.value.length;i++) {
        TravelNo[i].value = 1 + i;
    }
} 
Info
titleHow it works
  1. In this example, the user enters a number in the Number of Travelers (the control name is 'count') field in the form. Alternatively, you could also have a rule that retrieves the number of travelers from a webservice.
  2. The itemAdded statement is needed to determine if you are adding more sections. The first time the rule runs, this statement will evaluate as false and run the else statement
  3. Evaluate if the number of sections needed ('count.value') is greater than the number or existing sections. If true, set the maxOccurs first because the table needs to increase.
  4. If the number of sections needed is less than the number of existing sections then set the minOccurs first.
  5. The rule will loop through the existing sections and set the values in the TravelNo field. If there are still additional sections to be added after the rule has looped through the existing sections, the itemAdded lines will run.
  6. This rule sets the Min/Max properties to the same values so the plus and minus icons are not visible. This prevents users from adding repeating items.

Entering "3" as the number of travelers, sets the minOccurs and maxOccurs to 3 and shows three (3) information sections.

Repeat Item Initialization

...

Code Block
languagejs
titleRule Code
var i;
if (TableRepeat.itemAdded) {
    i = TableRepeat.itemIndex;
    TravelID[i].value = 1 + i;
} else {
    if (count.value > TravelID.value.length){
        Table.maxOccurs = count.value;
        Table.minOccurs = count.value;
    } else {
        Table.minOccurs = count.value;
        Table.maxOccurs = count.value;
    }
    for (i=0; i<TravelID.value.length;i++) {
        TravelID[i].value = 1 + i;
    }
} 

The images show the table when the user enters 5 as the number of travelers and then changes the value to 3.

Note

When you change the minOccurs and maxOccurs values in a business rule at run time, and the rule sets the min and max to the same value, the plus and minus icons disappear but the empty left-side column will still display.

...

A rule can dynamically display an image uploaded to your form via the upload control. In this example the upload control is named 'u'. The form also must contain a message control as a place holder for displaying the uploaded image. The rule dynamically creates a URL to the uploaded image in the temporary attachment repository. The upload control's value 'u.value' is a GUID that uniquely identifies the attachment. The uploaded image will be included in the submission PDF.

Code Block
titleRule Code
if (u.value.length > 0) {
  var baseUrl = "/frevvo/web/tn/" +
      _data.getParameter('tn.id') +
      "/user/"+_data.getParameter('user.id') +
      "/app/"+_data.getParameter('app.id') +
      "/form/"+_data.getParameter('form.id');
 
  im.value = '<img src="' +
         baseUrl + '/attachment/' + u.value+'/does_not_matter"/>';
}

...