Loading and running js and activate a trigger in Liferay 7

Question

I want to load a script and after executing this script launch a trigger. Formerly we did it with jquery and now we go to Alloyui. I'm trying to do this in Liferay 7 with AlloyUI. But I can't find the way, how can I do it?

jQuery.getScript("http://localhost:8082/js/test.js")
.done(function( script, textStatus ) {
  work();
  $(document).trigger('testEvent');
}

Thank you

Answer 1

Use aui:script to load modules within Liferay DXP (7.x).

The aui:script tag is a JSP tag that loads JavaScript in script tags on the page, while ensuring that certain resources are loaded before executing.

It tag supports the following options:

require: Requires an AMD module that will be loaded with the Liferay AMD Module Loader.
use: Uses an AlloyUI/YUI module that is loaded via the YUI loader.
position: The position the script tag is put on the page. Possible options are inline or auto.
sandbox: Whether to wrap the script tag in an anonymous function. If set to true, in addition to the wrapping, $ and _ are defined for jQuery and underscore.

Example: if you want to load the module foo and use its default function, you can use the following:

<aui:script require="path_to_foo_module as foo">
    foo.default('', {
        // Your code here;
    });
</aui:script>

Here is the real application that is being used at official liferay portal: https://github.com/liferay/liferay-portal/blob/master/modules/apps/commerce/commerce-order-web/src/main/resources/META-INF/resources/commerce_order/general.jsp#L430-L437. Where it calls the JS module at here: https://github.com/liferay/liferay-portal/blob/master/modules/apps/commerce/commerce-frontend-js/src/main/resources/META-INF/resources/components/summary/Summary.js