Custom JavaScript in application design
You can add custom JavaScript to supplement the standard Pega Platform JavaScript code to meet specific design or usage requirements for your application. For example, you can use custom scripts to modify the content of an HTML document dynamically, add custom client-side validation scripts, error messages, and more.
You can add custom JavaScript to UI components in the following ways:
- As a JavaScript text file inside a harness rule
- Harnesses are auto-generated, so you cannot edit the harness HTML manually. If
you want to include your custom scripts inside a particular harness, you can add
custom JavaScript saved as a text file to a harness rule by referencing the file
in the Scripts and styles tab of the harness.
For more information, see Adding scripts and style sheets to a harness.
- As JavaScript file in a static content bundle
- Static content bundles define a group of JavaScript files or Cascading Style
Sheet files that the server transmits to workstation browsers as a single unit.
You can use out-of-the-box Theme Cosmos static content bundles to introduce
global customizations to your application.
For more information, see Static content bundles for Theme Cosmos.
- As JS script tags, JS files, or HTML fragment rules inside an HTML of a custom section or control
- If you want to load custom JavaScript in a custom section or control, you can
add your scripts to the HTML source of the section or control. You can include
inline JS script tags, JS files, and HTML fragment rules to modify the default
code.
For more information, see Customizing sections and controls with JavaScript.
You can call custom JavaScript functions in the following ways:
- When an HTML rule is loaded
- The function runs when a document is loaded on a web page.
- From an event in a control
- The function runs every time a specific event occurs. You can configure the event with a Run script action in a control. For example, scripts can be triggered by events such as loading, element focus, or mouse movement. For more information, see Adding action sets to a control.
- Static content bundles for Theme Cosmos
By default, Theme Cosmos applications include script and style static content bundles that you can use to introduce global customizations to your application. Depending on the scope of changes and your preferences, you can either add your own JS and CSS files to the bundle, or expand the existing bundle files.
- Customizing sections and controls with JavaScript
You can extend the functionalities of your application by adding custom JavaScript to the source code of a non-autogenerated section or a custom control. For example, you can add JavaScript to a section to launch a client-side validation of a specific field when the section is rendered.
- JavaServer Pages tags
JavaServer Pages tags help you build hand-crafted, non-auto-generated rules for UI components.
- Best practices for using custom JavaScript
By following best practices for using custom JavaScript, you ensure that you can fully benefit from such functionalities as custom error messages or client-side validation.
- Creating binary file rules
Enhance and customize your application by creating a binary file rule that stores a graphics file, such as an image, or other non-text file. The binary file rule type provides the security, inheritance versioning, and deployment benefits of rule resolution to a file.
Previous topic Modified parameters in the mashup code prevent access to the mashup channel Next topic Static content bundles for Theme Cosmos