OpenWGA 7.4 - JavaScript reference

WGA
Method :

WGA.loadScript(config)

On object WGA
Usage Loads and executes an external JavaScript resource in an way compatible with AJAX portlets
Description

This method is a tool to be used when external JavaScript resources need to be loaded and directly used in the body part of an HTML request.

Specifying a simple HTML script tag with "src" attribute will load and the script asynchronously and therefor may not be too late for loaded functions to be available while the page scripts run.

Instead this method should be used in a script tag with inline code (see examples).  It receives the URL of the JavaScript resource to load plus a callback function which is called when the resource has been loaded and is therefor guaranteed to have the loaded resources available.

The JS resource that is loaded by WGA.loadScript() to the page is actually independent from the script tag that loaded it. Even if the script tag is contained in an AJAX portlet and that portlet is un- or reloaded then the JS resource will still be available to the page and does not need to get reloaded. You can use the "id" attribute of the method config to prevent unnecessarily loading the resource multiple times.

Parameters

config (JavaScript object):

Configuration object taking the following properties:

  • id (String, optional): An unique ID given to the loaded resource. WGA will prevent loading a resource if another resource of the same ID has already been loaded for the current page.
  • src (String): URL to the JavaScript resource to be loaded
  • onload (Function): Function to execute once the resource loading has finished

Examples

This would be the normal way to load a JavaScript resource into an HTML page. Assume that JavaScript function "buildDateControl" is defined by the external JavaScript resource "datecontrol".

<script src="<tml:url type="js" name="datecontrol"/>"></script>

<script>

buildDateControl('ctrlId');

</script>

This however does not work reliably in the body part of the page. The JavaScript source is loaded asynchronously and may be available too late for the following script block to execute "buildDateControl()".

On completely loaded pages a simple workaround would be to make the execution of "buildDateControl()" dependent on the page event "onload". On AJAX requests however no such event is thrown.

Instead WGA.loadScript() can be used the following way:

<script>


WGA.loadScript({

  src: "<tml:url type="js" name="datecontrol"/>",

  onload: function() {

    buildDateControl('ctrlId');

  }

});


</script>

If your code could appear multiple times on the same page (for example if it is the code of a CM module) then you could add an ID to the WGA.loadScript configuration. This would prevent the same resource be loaded multiple times for the same page, be it that that the code exists multiple times or the page part is reloaded via AJAX multiple times.

WGA.loadScript({

  id: 'my.datecontrol',

  src: "<tml:url type="js" name="datecontrol"/>",

  onload: function() {

    buildDateControl('ctrlId');

  }

});