Custom Javascript & How to run click actions or input validation via javascript within a design

This article will cover how run click actions and form validation via javascript. i.e. switch to frame or close design

On this page:

Introduction
How to run custom javascript in Justuno
Run Click Actions with custom javascript
Validate forms with custom javascript

Introduction

Sometimes you'll find a need to be able to switch frames, close a design/popup or submit a form via custom javascript within a design as a result of some other action or being shown a specific frame.  Other times you may want to validate a required field without requiring the user to click on a submit button.  You can do this via our custom code section or custom code blocks.

How to add javascript

There are three places you can use to run javascript which will all depend on your goal:

Via the custom code section of a design
Keep in mind this will only run once when the design is first loaded.  However if you define functions in this section, the functions will be available to be called from any of the other JS methods.

Via the custom code block
This code will execute on load of the frame it's added to.

Via the Javascript click action
This code will run when you click the element you assigned this click action to.

Javascript to run click actions

// here's an example of a close design click action

executeActions([
{
    "type": "close-design",
}
]);

// here's an example of a swtich to next frame action

executeActions([
{
"type":"frame","target":"_blank","url":"","frame":"","data":{"id":"next-frame","title":"Next Frame"}
}
]);

Javascript to run validation

If you need to validate form fields in a frame without submitting the form, you can do so with the following javascript

executeActions([{
    "type": "validate-form",
}]);