Action Javascript
Description
Action Javascript is a way to add javascript to a component in Alpha Anywhere with minimal to no code required.
Action Javascript uses properties to gather the information need to add the desired functionality. A wide variety of actions are available that accomplish numerous tasks, including opening components, uploading or downloading images and files, generating PDF reports, interacting with native features on a mobile device, and more.
It's important to understand that every Action Javascript requires javascript to trigger the action. Even if the bulk of the action happens on the server in an Xbasic routine, javascript is still required to contact the server to start the process. While code may not be displayed on the screen, you are creating javascript to implement the features and functionality added with Action Javascript.
When you edit an event for a control, the event's editor opens in Action Javascript editing mode. The two other modes, Text mode and Server-side Xbasic, are modes for writing javascript and Xbasic code, respectively. A new Action Javascript can be created using the "Add new Action" button. You can add as many Action Javascripts as you want.
Action Javascript is configured using properties. These properties allow you to define the behavior of the Action Javascript. For example, suppose you want to show a container in your UX component when the user clicks a button. In the click event for your button, you can add an Action Javascript, "Toggle display of a container or DIV with animation," to create this effect. In the specification for the Toggle display action, you'll find options to configure everything from the show/hide action, the element or container to modify, and the animations to use for showing and hiding the object.
If you have multiple containers or elements you want to hide, you can add multiple toggle display actions to handle each element or container affected.
Some Action Javascripts cannot be called multiple times in one event due to their underlying implementation. For example, if you wanted to show two or more messages in sequence when a button is clicked, you would probably add two "Message box" Action Javascripts to the button's click event. The expected behavior would be the first message would appear followed by the second message after the first message is dismissed. If you use a simple message box, this is the behavior you will see.
However, if the "Message box" actions both use advanced message boxes, the behavior is different. Using advanced messages, the first message is shown and immediately replaced by the second message. This is because the advanced message box doesn't block javascript execution nor does the underlying implementation support displaying multiple concurrent messages.
Similar to advanced message boxes, callbacks to a web server also do not block javascript execution. If you wanted to show another UX component in a window, your web application needs to make a callback to the server to retrieve the HTML, CSS, and javascript defining the UX component. If you wanted to show a message after the UX component is loaded, you would run into a new issue where the message box may be displayed before the UX component even starts to load. Fortunately, in this situation the Action Javascript can be run in sequence by checking "Run actions synchronously", which can be found at the bottom of the Edit Event window.
Run actions synchronously only applies to ajax callbacks made to the Alpha Anywhere server. It doesn't apply to ajax callbacks made to third-party servers.