Using JavaScript (Sage 200 Professional)

Introduction

JavaScript offers an alternative method to augment the Sage 200 Professional schema’s capabilities. By harnessing the power of JavaScript, Sage 200 Professional can become more flexible and customizable, enabling you to tailor it to your specific needs.

The documentation on Web Amendability does not delve into the specifics of JavaScript usage due to the vast and ever-expanding nature of JavaScript’s capabilities. This guide aims to provide a straightforward approach to targeting a JavaScript file using the schema within Sage 200 Professional.

Prerequisites

Please note that this guide is exclusively intended for users of Sage 200 Professional. Sage 200 Standard users do not have access to the Add-on packager, a vital component for deploying JavaScript files to Sage 200.

The Add-on packager is accessible solely to members of the Sage Developer Programme. To learn more about joining this program, kindly get in touch with our Developer Services Team.

JavaScript in Schema

In the provided JSON configuration, we demonstrate the integration of JavaScript within Sage 200 Professional’s schemas to extend user interfaces. Specifically, we’ll illustrate how to add a button to the “sales/amend-customer” page. This button, when clicked, triggers the sayHello function.

Importantly, if the current schema or any other schema lacks an action named “sayHello” the application will explore alternative methods with this reference. In such cases, it will seek out a JavaScript file deployed using the Add-on packager and the Sage 200 System Administrator Application (SAA).

{
  "version": "1.0",
  "pages": [
    "sales/amend-customer"
  ],
  "uiExtensions": [
    {
      "id": "buttonOne",
      "component": {
        "Button": {
          "id": "button2",
          "mt": 2,
          "onClick": {
            "action": "sayHello"
          },
          "children": [
            "Say Hello"
          ]
        }
      }
    }
  ],
  "actions": {},
  "validations": [],
  "events": [
    {
      "onLoad": [
        {
          "set": {
            "pageExtension": {
              "componentId": "short_name",
              "panel": "bottom",
              "uiExtension": "buttonOne"
            }
          }
        }
      ]
    }
  ]
}

JavaScript Functionality

To implement the above schema example, create a JavaScript file with the following sayHello function. Upon execution, this function triggers an alert displaying a greeting and the current location.

function sayHello() {
  window.alert('Hello everyone, from ' + window.location);
}

Deploying this JavaScript file entails generating an add-on package, resulting in an SDBX file. This package is then installed via the Sage 200 System Administrator Application (SAA). For a detailed deployment guide, consult the Sage 200 SDK Documentation. Please note, access is restricted to Sage UKI Developer Programme members.