Incorporating JavaScript Functions

You can include JavaScript functions by incorporating JavaScript

Editing the JavaScript attribute of the page
Calling the .js file from the HTML Header attribute of the page
Calling the .js file from the page template

Incorporating JavaScript Utilizing the JavaScript Attribute

You can include JavaScript into your application by adding it to the JavaScript attribute of the page. This is a good approach for functions that are very specific to a page and a convenient way to test a function before you include it in the .js file.

In the following example, adding the code would make the test function accessible from anywhere on the current page.

To add JavaScript code to the JavaScript attribute:

Navigate to the Page Definition. See "Accessing the Page Definition".
To access the Edit Page:
- Tree view - Under Page Rendering, double-click the page title at the top of the tree.
- Component view- Under Page, click the Edit icon.
Scroll down to JavaScript.
Enter code into the following:
- Function and Global Variable Declaration - Enter JavaScript code (for example, functions or global variable declarations) for code to be used on this page. If the code is used on multiple pages, consider putting it into an external JavaScript file to avoid duplication.
  
  Code you enter here replaces the #JAVASCRIPT_CODE# substitution string in the page template.
- Execute When Page Loads - Enter JavaScript code to execute when the page loads. The code is executed after the JavaScript code generated by Oracle Application Expresss.
For example, adding the following would test a function accessible from anywhere on the current page.
```
  function test(){
    window.alert('This is a test.');
  }
```
Apply Changes.

Calling the JavaScript File from the HTML Header Attribute

To call a .js file from the HTML Header attribute:

Navigate to the Page Definition. See "Accessing the Page Definition".
To access the Edit Page:
- Tree view - Under Page Rendering, double-click the page title at the top of the tree.
- Component view- Under Page, click the Edit icon.
Scroll down to HTML Header and Body Attribute.

In HTML Header, call the JavaScript file using the following syntax:

<script src="/my_images/custom.js" type="text/javascript"></script>

Apply Changes.

Calling the JavaScript File from the Page Template

In Oracle Application Express, you can reference a .js file in the page template. This approach makes all the JavaScript in that file accessible to the application. This is the most efficient approach since a .js file loads on the first page view of your application and is then cached by the browser.

The following demonstrates how to include a .js file in the header section of a page template. Note the line script src= that appears in bold.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>#TITLE#</title>
    #HEAD#
    <script src="/my_images/custom.js" type="text/javascript"></script>
</head>
<body #ONLOAD#>#FORM_OPEN#