Listens for an event on one or more subjects and calls a method on one or more targets when that event is handled.
Invoke the remote
method on the parent element every time a trigger
event is received by the window
.
<fluid-triggered-method handle="trigger" method="remote">
</fluid-triggered-method>
<fluid-triggered-method>
is available on NPM and may be installed as a dependency.
> npm install @cogizmo/fluid-triggered-method
-
Place the files on your server.
-
Install the appropriate cogizmo/Cogizmo.
- From npm
> npm install @cogizmo/cogizmo
- From github
-
Add Cogizmo to your document
<head>
.<script src="path/to/Cogizmo.js"></script>
-
Add
<fluid-triggered-method>
element to your document.<script src="path/to/fluid-triggered-method.js"></script>
-
Use element whereever you want to transclude html.
<fluid-triggered-method></fluid-triggered-method>
String<EventName>
The event that the proxy handler listens for to trigger the method call. Will listen for 'trigger'
, unless specified.
<fluid-triggered-method handle="my-event">
</fluid-triggered-method>
String<CSS Selector>
Will trigger the method for each element returned by a valid CSS query
selector. If omitted, <fluid-triggered-method>
will listen on the window
or
global
object.
<fluid-triggered-method handle="multi-event" listens=".Class">
</fluid-triggered-method>
String<MethodName>
Case-Sensitive
The method to call on the target element(s) when the event is handled. The method must be publicly accessible on the element object, not an internal or private API.
<fluid-triggered-method method="callMe">
</fluid-triggered-method>
String<CSS Selector>
Array of element nodes to invoke the method on when the event is handled. If
omitted, <fluid-triggered-method>
will invoke the method on it's host
or
it's parentElement
.
<fluid-triggered-method targets="">
</fluid-triggered-method>
Boolean
Event behaves as if preventDefault()
has been called on it.
<fluid-triggered-method handle="cancelme" cancel></fluid-triggered-method>
Boolean
Calls stopPropagation()
on the event when it is handled.
<fluid-triggered-method handle="happening" stop></fluid-triggered-method>
Boolean
If stop
attribute is true
, then when the event is handled, stopImmediatePropagation()
will be called on it, preventing further bubbling.
<fluid-triggered-method handle="trigger" stop immediate>
</fluid-triggered-method>
Returns String
The name of the event that <fluid-triggered-method>
is listening for.
Changing the event will remove all listeners for the previous event name and
add new listeners for the new name.
Returns String<CSSSelector>
Gets or sets the selector on which to listen for the desired event on. Will remove listeners and add new listeners when the selector is changed.
Returns Array
- ReadOnly
An Array of element nodes that listeners will be added to.
Returns String<CSSSelector>
Gets or sets the selector on which to invoke the method and forward the event. Will remove listeners and add new listeners when the selector is changed.
Returns Array
- ReadOnly
An Array of element nodes that the method will be call
ed on.
Returns Boolean
Whether to call preventDefault()
on the handled event.
Returns Boolean
Whether to call stopPropagation()
on the handled event.
Returns Boolean
Whether to call stopImmediatePropagation()
on the handled event.
<fluid-triggered-method>
is intended as a method proxy that is triggerd when events are handled. It does not currently dispatch its own events.