The global hook at the app level allows developers to write reusable functions that can be used in other hooks.
Parameters #
None
Return value #
None
Example of a custom button added using a JavaScript template #
function myCustomAction(columnName) {
return `<div>
<button onclick="alert('My custom action from column ${columnName}')">My Custom Action</button>
</div>`
}The same example using vanilla JavaScript #
function myCustomAction(columnName) {
const div = window.document.createElement("div")
const button = window.document.createElement("button")
button.innerHTML = "My Custom Action"
button.setAttribute("onclick", `alert('My custom action from column ${columnName}')`)
div.append(button)
return div
}The same example using jQuery #
function myCustomAction(columnName) {
if (window.jQuery) {
return window.jQuery(`<div>
<button onclick="alert('My custom action from column ${columnName}')">My Custom Action</button>
</div>`)
} else {
return null
}
}Notes #
- It is not possible to add event listeners to dynamically added elements. In the example above, the onclick event was added using the setAttribute method.
- Do not define a function name as a constant. Doing so will result in an error when the function body is updated.
