hgh / yii-js-event-handler
Using this library, You can define custom events and trigger them on other events trigger.
Installs: 1
Dependents: 1
Suggesters: 0
Security: 0
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Language:JavaScript
Requires
- components/jquery: *
- yiisoft/yii2: ~2.0.0
README
Using this Library you can trigger your custom events
on some another elements trigger.
Instalation
composer require hgh/yii-js-event-handler
Usage
Register Yii2 Asset
YiiJsEventHandlerAsset::register($this);
Instantiate jQuery Plugin
There are two way of instantiate this jQuery
plugin.
Use default attributes
To use default options you have to add two predefined attribute to your html
element. You put your custom JS
events into data-events-to-run
. Separate your custom events
using space
. Then using data-on
specify when these custom events
should be trigger. The values that you can put in data-on
follows jQuery
events. Visit Form events, Mouse events and keyboard events .
<div data-on="click" data-events-to-run="customEvent anotherCustomEvent">
Define your custom attributes
In other hand, You can define your custom attributes. For this you have to instantiate
eventHandler
plugin.
$(document).ready(function () { $("[data-my-custom-on-attribute]").eventHandler({ onEventAttribute: "data-my-custom-on-attribute", toRunEventsAttribute: "data-my-custom-to-run-events-attribute" }); });
Now, you can use these attributes like this:
<div data-my-custom-on-attribute="click" data-my-custom-to-run-events-attribute="customEvent anotherCustomEvent">
Sample
html
<div data-on="click" data-events-to-run="customEvent anotherCustomEvent"> Click Me to Run Custom Event</div>
jquery
$(document).ready(function () { $(document).on("customEvent", function () { alert("Custom event triggered"); }); $(document).on("anotherCustomEvent", function () { alert("Another custom event triggered"); });});