Back Forward Harness form
Completing the Scripts and Styles tab

  1. About 
  2. New 
  3. Layout 
  4. Scripts and Styles 
  5. Pages & Classes 
  6. HTML 
  1. Display Options 
  2. History 
  3. More... 

Complete these two optional arrays to supplement or override the standard client JavaScript scripts that support the harness form, and to supplement or override the standard Cascading Style Sheet style definitions that support the harness form.

Reference the second and third key parts of a text file rule in each array. Order is significant; the scripts and styles in files you reference on this tab have precedence over those inserted automatically.

When you save the harness form, PRPC generates HTML that contains <pega:include > JSP tags, to cause stream processing to reference the text file rules. In the sections referenced by this harness, you can create HTML text that references the custom styles or scripts.

For harnesses, unlike sections or flow actions, HTML code is always automatically generated; you cannot edit it.

Field

Description

Scripts and Script Bundles
Type Optional. Select one of the following to indicate what type of script references you want to use:

js — Identify the text file rule for JavaScript references.

bundle — Identify a static content bundle rule references.

Name JavaScript

Enter the File Name and File Type key parts of a text file rule that contains source text for JavaScript scripts referenced in the HTML of this harness, separated by a period. The system assumes webwb is the first key part. A script file can use any scripting language supported by the user browsers such as VBScript (for Internet Explorer) or JavaScript.

For example, enter mortgage.js to reference a script file named navigation.js, stored in the text file rule named webwb.mortgage.js.

You can enter more than one script file reference. Order is significant.

TipTo reorder the rows of this array, hold the mouse pointer over a number. Click and drag to another row. To duplicate or move a row, hold the mouse pointer over a number. Or, right-click to access a context menu with Cut, Copy, and Insert options.

Script Bundles

Enter the Bundle Name and Bundle Type key parts of a static content bundle rule. See About Static Content Bundle rules.

You can enter more than one static content bundle reference. Order is significant. Reorder the rows in this array using the mouse pointer or right-click menu.

Style Sheets
Style Optional.

Enter the File Name and File Type key parts of a text file rule that contains source text for cascading style sheets (CSS) referenced in the HTML code of this harness, separated by a backslash. For example, css\mystyles.

Tip As a best practice, leave this array blank and apply styles through a Skin rule. Using a Skin rule ensures that the styles apply uniformly to all work item harnesses throughout your application.

You can add the styles to the Skin rule, which auto-generates the CSS, and makes it easier to maintain and upgrade. Alternatively, you can include additional style sheets on the CSS tab of the Skin rule. However, the recommended approach is to add the styles directly to the Skin rule.

By default, many styles referenced in harness forms are defined in a standard text file rule named webwb.workform.css. An empty style sheet (containing many style definitions as comments) is named webwb.user_work_form.css. You can override the webwb.user_work_form.css text file rule with another containing style definitions of your own design, being careful to retain the same style names as the standard. Values you enter in this field affect the appearance of only this harness.

To apply a set of custom styles to all harnesses associated with an application, use a skin rule, associated with a portal rule. See About Skin rules and About Portal rules.



To find the text file rule at runtime, the system uses webwb is the first key part. For example, enter user_work_form_blue.css to reference a style file named user_work_form_blue.css, stored in the text file rule named webwb.user_work_form_blue.css.

In the Text File form, set the RelativePath value to css. You can enter more than one style sheet reference. Order is significant; the bottom style sheet is applied last.

OldThis array provides for backwards compatibility with versions before V5.4.

Applying V6.2 styles to screen flow harnesses

The V6.2 case manager and case worker portals (pyCaseManager and pyCaseWorker) and standard V6.2 user form harnesses use the EndUser62 skin and styles. However, the standard V6.2 screen flow harnesses including Work-.PerformScreenFlow, Work-.TabbedScreenFlow, and Work-.TreeNavigation do not, by default, use these styles.

To keep the user interface styles consistent, copy the screen flow harnesses to your application RuleSet and select the standard CSS text file pyScreenFlow_EndUser62 in this Style field. In the Start shape properties panel for each screen flow used by your process, specify your harness in the Harness field.

If you modify the EndUser62 Skin rule, you can reflect those changes in your screen flows by copying the CSS file pyScreenFlow_EndUser62 to your application RuleSet and manually modifying the file's contents. If you change the application skin from EndUser62, remove pyScreenFlow_EndUser62 from this field.

Generate harness specific CSS Appears when a style sheet is entered in the Style array. This option is intended to enhance performance when using custom styles. When selected, the system generates the style sheet based on the CSS selectors used by this harness; all the unused selectors are filtered out to reduce the file size. The generated CSS is not shared with other harnesses.

Text and verify the results, as some styles may have been removed unintentionally. Also, if you intend to enable this harness throughout the application, the system produces for every harness a unique style sheet that is generated and downloaded individually. In this case, it is preferable to download all of the styles once, even if they are not all used.

Defaults

If you leave these two arrays blank, the resulting HTML code references the JavaScript functions and CSS styles produced by the standard HTML Fragment named WorkFormStandard, which includes other HTML Fragments that include standard text file rules:

Up About Harnesses