Using the Layout Designer - JavaScript Page

To access the JavaScript page (IB_DOCLOJS) select PeopleTools > Mobile Application Platform > Layout Designer and click the JavaScript tab.

Image: Layout Designer – JavaScript page

This example illustrates the fields and controls on the Layout Designer – JavaScript page. You can find definitions for the fields and controls later on this page.

Layout Designer - JavaScript page

Field or Control

Definition

Layout Name

Displays the name of the layout.

Description

Displays the description of the layout.

jQuery Version

To view this field, expand the Non-delivered Version section.

Check the box to use jQuery code that adheres to a non-supported version of jQuery.

jQuery Mobile Version

To view this field, expand the Non-delivered Version section.

Check the box to use jQuery Mobile code that adheres to a non-supported version of jQuery Mobile.

Add JavaScript

Click the button to add a new page for creating JavaScript.

JavaScript Name

Enter a name for the JavaScript file, including the .js extension.

Template Name

If the JavaScript displaying on the page being read from a layout template, this field displays the template name where the JavaScript is defined.

Template Indicator

When checked, this read-only field indicates that the source of the JavaScript is from a layout template.

External File Option

Check the box to save a copy of the JavaScript on the web server at the following location:

<PIA_HOME>\webserv\<PIA_DOMAIN>\applications\peoplesoft\PSIGW.war\map\<NODE_NAME>\
layouts\<LAYOUT_NAME>\css
JavaScript

Use the long edit box to code the JavaScript. Note that the system does not perform any validation checks on the JavaScript code.

Event Type

Select a jQuery Mobile event from the drop-down list. The options are:

  • mobileinit. (Default.)

  • pageinit.

  • ready.

Add Mobile Event

After you select a jQuery Mobile event type, click the button to add the event.

Mobile Events

Use the long edit box to code the jQuery Mobile event. The framework automatically defines the method syntax and places the method within the HTML markup. You need only add the contents of the appropriate event.

Note: No validation is performed on the code you enter.

Save

Click the button to save the additions and changes to this page.