Overview

Listen for Custom Events in your Mendix page. This greatly expands the possibilities, as you are able to execute Custom Events simply from a Javascript Action in a Nanoflow.

• The widget will listen for custom events on the document element
• When this event is detected, it can execute an action (Nanoflow, microflow, etc...)
• If you provide an attribute, it will put the value coming from CustomEvent.detail in this attribute before executing the action

Documentation

CustomEventListener

Listen for custom events on your page

Features

• The widget will listen for custom events on the document element
• When this event is detected, it can execute an action (Nanoflow, microflow, etc...)
• If you provide an attribute, it will put the value coming from CustomEvent.detail in this attribute before executing the action

Example

Configuration

See Github

• I have configured the widget to listen for a CustomEvent with the name CustomEvent
• When this event is detected, I execute the Nanoflow OnAction

Somewhere else in my page I execute a Nanoflow with a Javascript action. This action contains the following code:

// This file was generated by Mendix Studio Pro. // // WARNING: Only the following code will be retained when actions are regenerated: // - the import list // - the code between BEGIN USER CODE and END USER CODE // - the code between BEGIN EXTRA CODE and END EXTRA CODE // Other code you write will be lost the next time you deploy the project. import { Big } from "big.js"; // BEGIN EXTRA CODE // END EXTRA CODE /** * @param {string} eventName * @param {string} eventData * @returns {Promise.} */ export async function FireAction(eventName, eventData) { // BEGIN USER CODE const eventOptions = eventData ? { detail: eventData } : {}; return document.dispatchEvent(new CustomEvent(eventName, eventOptions)) // END USER CODE }

In this case, I execute this Javascript action with eventName = 'CustomEvent' and no data.

Demo project

A demo can be found here

Issues, suggestions and feature requests

Feedback can be provided on Github or through the feedback button on the demo project page

License

The MIT License (MIT)

Copyright © CaffCode 2022. All Rights Reserved.

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.