JavaScript Services

You can use your own client-side JavaScript to further customize your WaveMaker application. This section discusses how and where you can call your custom JavaScript in a WaveMaker application:

• Executing JavaScript on Widget Events
• Executing JavaScript on Page Loading
• Executing JavaScript on Service Variable Results

Executing JavaScript on Widget Events

To call JavaScript for a widget event, first select the widget. In the Property Tree, click Events. The events available for the selected widget appear in the Property Editor. For the event you want to set, choose the JavaScript option in the drop-down menu. This automatically declares the appropriate function and opens the Source tab at the appropriate place.

For example, suppose you have a button named, "formSubmitButton" and you want to create custom JavaScript to execute when the user clicks this button. To set up the JavaScript you follow these steps:

1. In the Page Designer, select your button, "formSubmitButton".
2. In the Property Tree, click Events.
3. In the Property Editor, click on the Events tab.
4. Type in the JavaScript function that you want to execute on the button click.

Executing JavaScript on Page Loading

To set up JavaScript that executes upon the loading of the page, follow these steps:

1. Open the page in the Page Designer.
2. Click on the Source button at the top left of the Page Designer (next to the Canvas button). The script file for the page appears.
3. Implement the start function. The start function executes when the page loads.
4. For example, you could type the following:

start: function() {
console.log("Hello WaveMaker");
},

This example uses the Firebug add-on to write to the console log (Debugging with Firebug).

Executing JavaScript on Service Variable Results

In your JavaScript code, you can access the results of a Service Variable by writing JavaScript code in the source for the onResult event of the Service Variable. The onResult event is called upon the successful completion of the Service Variable.