Form Progress Controller

Form Progress Controller is a Stimulus controller for showing progress completing a form.

This was just put together for a presentation.

Attributes

HTML Attributes

These are standard HTML attributes (with no prefix) used by the controller.

Attribute Element(s) Default Value(s) Description
aria-busy (controller)
false true
false
The controller will set this to true any time it is updating the DOM.
You can use the value in your CSS to indicate that work is in progress.

data- Attributes

All of these attributes are prefixed with "data-" in the attribute name.

Attribute Element(s) Default Value(s) Description
controller * formprogress This attribute provides the controller functionality.

Events

formprogress: Events

These are custom events that the controller will fire when it takes certain actions.

All of these events are prefixed by "formprogress:".

Event Parameters Description
initialized Called any time that the controller is initialized.
connected Called any time that the controller is connected.
disconnected Called any time that the controller is disconnected.
progressed

detail: (the progress object)

Called any time that the controller updates the progress element.

Methods

While it is recommended to use the controller via the attributes listed above, the following methods can be called directly if needed.

Method Returns Arguments Event(s) Description
getProgress

Returns the progress data (from the progress element).

setProgress

Updates progress the progress element with the current progress of the form.