On Enter

Last updated 25/07/2025

This documentation will demonstrate how the On Enter event works. The On Enter event is a client-side event. When entering a field either by clicking or tabbing into the field, the function attached to the On Enter event will execute. Effectively, as a user enters the field the event fires the code.

The Orders application is used to demonstrate the On Enter event.

Execute an On Enter Event

The

CalculateTotal()

function uses the

field

property on the

Five

object in the format

five.field.<fieldID>

to multiply the values in the Quantity and the Price fields and enters the calculated value into the Total field.

Calculate total

function CalculateTotal(five, context, result)  {
    five.field.Total = five.field.Quantity * five.field.Price;
    return five.success(result);
}

The

CalculateTotal()

function is saved in the Functions view in Five.

Figure 1 - CalculateTotal function

The

CalculateTotal()

function is attached to the On Enter event for the Total field on the Order Items form.

Figure 2 - On Enter field

In the Orders application on the Orders form, a product is selected and values are entered into the Quantity and Price fields, the Price field is populated by an On List Select event. On entering the Total field, the On Enter event executes the

CalculateTotal()

function which calculates the total and populates the Total field with the value.

note

You may need to refresh your screen to see the gif.

Figure 3 - On Enter event