Customizing harnesses globally with JavaScript
Customize all harnesses in your application by modifying the default JavaScript code.
For global changes in your application, you can include the customized scripts in the UserWorkForm HTML fragment rule, which is called during the loading of a harness.
In the header of Dev Studio, in the Search field, search for and open the UserWorkForm HTML fragment rule.
Click Save As.
On the New tab, in the Context section, specify the context of the fragment rule:
In the Development branch list, select the branch.
Select the check box with your application name.
In the Add to ruleset list, select the ruleset that is specific to your application.
Note: Do not change the name of the fragment rule. Click Create and open.
Result: The HTML fragment rule is now available to the application ruleset. On the HTML tab, in the text field, enter your custom JavaScript code.
For example: To change the default busy indicator image, perform the following actions: - Create a binary file with your custom image.
- On the HTML tab of the UserWorkForm HTML fragment rule, in the text field, add the following snippet in HTML Source:
<script> pega.ui.busyIndicator.prototype.createIndicatorImage = function() { if(this.oSpan == null) this.initialize(this._sNode); var oSpan = this.oSpan; if (this._message && this._message.length > 0) oSpan.innerHTML = "<img src = 'webwb/CustomPreloader.gif' alt='loading' />" + " " + this._message ; else oSpan.innerHTML = "<img src = 'webwb/CustomPreloader.gif' alt='loading' />"; } </script>In the upper-right corner of the screen, click Save.
Result: All of the harnesses of your application now include the custom script, which runs whenever a harness is loaded.
Previous topic Best practices for using custom JavaScript Next topic Customizing sections and controls with JavaScript