Events

Fore is an event-driven state-engine. It reacts to events and dispatches itself events to reflect it’s state. Each operation in Fore is triggered by some event. You can hook your functionality into the page by defining actions for a given event.

Lifecycle Events

Lifecylce events can be used for initialization tasks. When Fore is loaded into the DOM of a web page it will dispatch the following sequence of events:

NameDescriptiontarget
model-constructis not of much practical use but just signals that Fore is alivefx-model
model-construct-donefires after all fx-instance elements have initialized and the model is setup. At this point we can rely on the existence of the referenced data.fx-model
rebuild-doneis emitted when the model was rebuild. During this stage Fore creates its dependency graph.fx-model
recalculate-doneis emitted when the model was recalculated. During this stage Fore evaluates the dependency graph.fx-model
refresh-doneis emitted when the UI has been updated fully. Data in the model are now reflected in the UI.fx-fore
readyis dispatched when the current Fore element is fully initialized and renderedfx-fore

For all work that should be done before the first rendering takes place use a ‘model-construct-done’ handler. This is the best place to load additional data and do more complex initialization tasks as all actions triggered by ‘model-construct-done’ will run within a single update cycle.

On ‘ready’ you can rely on the UI being fully rendered. This also means that all ‘init’ events attached to controls have been executed and eventual custom initialization tasks have been run.

General Events

A Fore Action can listen to any event. These might the native ones or custom events.

If events specify a details object this can be accessed with the Fore event('propname') function. See under Functions.

NameDescriptionTarget
clickjust listed here as it might be of frequent interest.parentNode by default
any native JS event-parentNode by default
any custom event-parentNode by default

Update Cycle Events

Some actions mutate data and report this to the model by setting a ’needsUpdate’ flag. When an action block is done it will check for the flag and update the model and UI accordingly by:

  • optionally fully rebuild the model constraints (usually avoided)
  • recalculate changed items
  • revalidate changed items
  • refresh controls/containers bound to changed items
NameDescriptionTargetdetails
rebuild-donefires after a rebuild has taken placefx-modelmaingraph - the main dependency graph
recalculate-donefires after a recalculate has taken placefx-modelgraph - the depencency main- or subgraph, computes - the amount of computes
refresh-donefires after a refresh has been done. The UI reflects the model state.fx-fore-

Control State Events

State events are dispatched whenever the state of a bound element changes.

NameDescriptionTargetDetails
initfires when a control initializesfx-control-
readonlyfires after an fx-control became readonlyfx-control-
readwritefires after an fx-control became readwritefx-control-
optionalfires after an fx-control became optionalfx-control-
requiredfires after an fx-control became requiredfx-control-
nonrelevantfires after an fx-control became nonrelevantfx-control-
relevantfires after a fx-control has become relevantfx-control-
invalidfires after a fx-control has become invalidfx-control-
validfires after a fx-control has become validfx-control-
value-changedfires after a fx-control has changed its valuefx-controlpath- the normalized path of the bound node, value - the value of the bound node

Instance Events

NameDescriptionTarget
deletedfires after a delete action has been executedfx-instance
insertfires when an fx-insert is executedfx-instance
instance-loadedfires after an fx-instance has been loadedfx-instance

Submission Events

NameDescriptionTargetDetails
submitdispatch before submission is taking placefx-submissionsubmission - the fx-submission element
submit-donefires after a submission has successfully been executedfx-submission-
submit-errorfires when a submission returned an errorfx-submissionmessage - the submit error

Repeat Events

NameDescriptionTarget
item-createdfires when a repeat item was createdfx-repeat
item-changedfires when a repeat item was changedfx-repeat
path-mutatedfires when a path in a repeat has been mutatedfx-repeat
no-template-errorfires when repeat has no template childfx-repeat

Switch events

NameDescriptionTarget
deselectfires when fx-case is deselectedfx-case element that was deselected
selectfires when fx-case is deselectedfx-case element that was selected

Dialog Events

NameDescriptionTarget
dialog-hiddenfires after fx-dialog has been hiddenfx-dialog
dialog-shownfired when a dialog has been shownfx-dialog

Other

NameDescriptionTargetDetails
errorfires after an error occurredfx-foremessage - the error message
execute-actionfires when an action executes. For internal use.any action elementaction' - the action element, event`- the event object
loadedfires after a fx-load has loaded or a sub-Fore has been loadedfx-loadurl - the evaluated url used by the load action, fore - the Fore element that has been loaded
outermost-action-startfires when an outermost action block is startedfx-actioncause - the event object causing the action
outermost-action-endfires when an outermost action block is finishedfx-action-
reloadfires when a fx-reload action executesfx-reload-
returnfired by embedded Fore controls to return their bound valuefx-forenodeset - the nodeset returned by a subpage
warndispatched internally by Fore to display warning messagesfx-foremessage - the warning message