Eraser Controller

Eraser Controller is a Stimulus controller for clearing out hidden form fields. This does *not* empty out fields of type="hidden", but rather other form fields that are hidden by either CSS or the "hidden" HTML attribute.

It can either clear fields as they are hidden or when the form is submitted.

The controller will define hidden fields as any field that has a "hidden" attribute of true or that has a "display" style of "none" or a "visibility" of "hidden". It does not define hidden based on the location of the element.

Attributes

data- Attributes

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

Attribute Element(s) Default Value(s) Description
controller * eraser This attribute provides the eraser functionality.
action form
eraser#clearHidden This may be set by the controller on the form element based on the data-eraser-clearhidden-on attribute.

data-eraser- Attributes

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

Attribute Element(s) Default Value(s) Description
clearhidden-on * hide Clears hidden elements as they are hidden.
form submit Clears hidden elements only when the form is submitted.
keep (any) Determines if fields in this element (or its children) should be kept when hidden. This attribute may be placed on any element, and the controller will check the element and its children to see if it is set to "true". If so, the element will not be cleared when hidden.
true The element (and its children) will not be cleared when hidden.
false The element (and its children) will be cleared when hidden.
This attribute can be used to override a parent element that has keep="true".

Events

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

eraser: Events

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

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.
cleared

target: (the element that is cleared)

Called any time that the controller clears the value from an 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
clearAll

Clears all fields in the controller (whether hidden or not).

Calls "clearElement" for each field.

clearElement
  • element: The element to clear
event:cleared

Clears the given element (whether it is hidden or not).

clearHidden

Clears all of the hidden fields in the controller.

Calls "clearElement" for each hidden field.

clearScope
  • scope: The element to clear

Clears the given scope (element) and all of its children (whether hidden or not).

Calls "clearElement" for each field.

getHiddenFields array
  • scope: The element to search

Returns an array of hidden form fields in the given scope.

getScopeFields array
  • scope: The element to search

Returns an array of all form fields in the given scope.

isElementVisible boolean
  • element: The element to check

Returns a boolean to indicate if the given element is visible.