Synchronous server-side calls

The Client API allows you to execute any server-side function from a browser JavaScript event. The functions that you call must be accessible to your application, i.e. must be in a client-callable script.

In this tutorial you will execute simple function synchronously, i.e. you will be blocked from further activity on the page until the function call is complete.

Steps

Create a new form called myClientApi.

Add three numeric fields called f1, f2 and f3 to the form. Make f3 Display only.

Drag and drop a button between f2 and f3 and change its text to ADD.

Create a new JavaScript script called myFunctions. This is where your client-callable functions will be defined.

Create the following function in your script:

function add() {
   fields.f3.value = fields.f1.value + fields.f2.value;
}

Note that the function simply adds two fields together and stores the result in a third.

Go to the Form Properties and open the Events tab. Add the myFunctions script to the list of Client Callable Functions scripts.

Right click the button, open its Html Element Properties and go to the HTML tab.

Choose the onclick event in the Events drop down list.

Open the Code box and add the following JavaScript:

$eb.executeFunction('add');

Run the form , enter values into f1 and f2 and click ADD.

Note that nothing apparently happens! However, look in the Server Log and observe that your function was in fact called.

The reason nothing appeared was because we didn't tell it to.

Go back to your button's Html Element Properties and open the code box.

Change your code to the following:

$eb.executeFunction('add', null, true, true);

What this is now saying is:

Execute the add function
Don't pass any parameters
Automatically refresh the page with any changes resulting from the executed function
Submit all of the data on the page to the server before executing the function

This means that whatever values we enter into f1 and f2 will be updated on the server before the function executes. It also means that the value of f3 will be automatically updates on the browser page once the function completes.