External Scripts

External java script files help you to create different types of graphics such as graphs, charts, and data visualization. You need to first create the java script file within a project and then add them to a UI Model.

Perform the following steps:

  1. Open the project and navigate to the UI Model folder.
  2. Click the context menu, select New, and click Javascript.
  3. Enter File Name and click OK. The file is saved with .js extension.
  4. In the file editor, enter the JavaScript that you want use in your application design and Save the file.
  5. Navigate to the UI model (.vm file) that you want to associate with the external Javascript.
  6. Click Add from the External Scripts drop-down and select the .js file that you created.
  7. Enter the variable in the text field. The variable must be the same as specified in the .js file that you added.
  8. Click Save to update the UI model (.vm file).
  9. You have successfully added the external Javascript to your app view.

Javascript Syntax

You can add as many functions as you need in javascript file. All the functions must be enclosed within a variable as per the syntax in the following example. In this example enclose is the variable.

Copy
var enclose = {
    function1: function() {
        document.write(Hello World);
    },
    function2: function() {
        document.write("user Name()");
    },
    function3: function() {
        document.write("new Date()");
    }
}

Calling Functions from Javascript

After adding the javascript file to UI model, you can call the functions from javascript using the controls in UI model.

Perform the following steps:

  1. Select the control that you already added in the UI model.
  2. Click Actions under the Settings tab.
  3. Add a Function Call in the script model. To learn about how to create script model and different types of tasks, see Script Model.
  4. Select the Functional Call and click Function Body.
  5. Enter the function that you want to call as per the following syntax:
  6. <variable.function name>

    Copy
    enclose.function1();
  7. Save and close the Script Model.
  8. When the users execute the app and operate the UI control, the corresponding script model is executed and the specified function is called from the javascript.