Creates a `data-hx-on` attribute.

This attribute instructs HTMX to react to events with inline scripts on elements.

• $event is the name of the JavaScript event.
• $action is the JavaScript statement to execute when the event occurs. This can be a short instruction or call a function in a script that has been loaded by the page.

Parameters

string $event: An event in either camelCase or kebab-case.

string $action: The JavaScript statement.

Return value

static Returns this object to allow chaining methods.

See also

https://htmx.org/attributes/hx-on/

File

core/lib/Drupal/Core/Htmx/Htmx.php, line 633

Class

Htmx

Presents the HTMX controls for developers to use with render arrays.

Namespace

Drupal\Core\Htmx

Code

public function on(string $event, string $action) : static {
  // Special case: the `::EventName` shorthand for `htmx:EventName`.
  // Prepare a leading '-' so that our final attribute is
  // `data-hx--event-name` rather than `data-hx-event-name`.
  $extra = str_starts_with($event, '::') ? '-' : '';
  $formattedEvent = 'hx-on-' . $extra . $this->ensureKebabCase($event);
  $this->createStringAttribute($formattedEvent, $action);
  return $this;
}

---