Add JavaScript to Interview Screens

JavaScript can be used to customize the appearance and behavior of controls on an Intelligent Advisor interview screen, to create interactive content that is otherwise impossible to achieve with the standard controls. JavaScript code is most appropriately used in conjunction with interview extensions. JavaScript can also be used with Custom Controls. JavaScript can be used to manipulate other page content, but this carries a higher risk of incompatibilities with future Intelligent Advisor upgrades. Follow the guidelines later in this topic to ensure that your JavaScript implementation will not cause your interview to fail with future Intelligent Advisor upgrades.

Note: Software development skills are necessary to implement JavaScript on Intelligent Advisor interview screens.

To add JavaScript to your Intelligent Advisor interview:

  1. On the Interview tab in Policy Modeling, click the Styles button.
  2. In the Styles dialog box, click the Custom Files button. (If the project doesn't already have any custom files, you will be warned that custom files can make manual upgrade necessary for future product versions, and that you must test any customizations against WCAG 2.1 accessibility standards. Click OK.) Windows Explorer will open to the /interview-theme/resources folder in the project directory.
  3. Copy your JavaScript files (for example, the interview extension .js file) into the /interview-theme/resources/ folder.

At runtime, any JavaScript (*.js) file that is placed in the /interview-theme/resources/ folder will be automatically loaded for every page in the Intelligent Advisor interview.

Note that the JavaScript files in the interview-theme/resources/ folder are loaded in the interview in alphabetical order by file name. If you have dependencies, that is your files need to load in a particular order, you need to take that into consideration when naming your JavaScript files. For example, if you are using jQuery, ensure that your custom JavaScript files use file names that starts with a letter that appears alphabetically after the jQuery library.

The JavaScript you have implemented will appear as separate <script> tags at the top of each page. Note that the browser may cache the custom JavaScript file, in which case any subsequent changes to the file will not be displayed until reload the interview in the browser.

You can refer to images and other resources in your custom JavaScript.

Tip: For August 2016 version interviews, custom JavaScript code can also rely on the jQuery library already being loaded at runtime.

The following are important guidelines for using JavaScript in Intelligent Advisor interviews.

  • Do use JavaScript extensions to customize the styling and behavior of interviews and controls
  • Do use JavaScript to customize the appearance and behavior of Custom Controls
  • Do not use JavaScript to restructure any elements on the page
  • Do not use JavaScript to redirect or otherwise change the flow of the interview

You must follow these guidelines, or your interview may experience problems when upgrading to a newer version of Intelligent Advisor. This is especially important for Oracle B2C Service users, because the timing of B2C Service upgrades is managed centrally and is not under the control of individual projects or sites.