Procedures for editing scripts

In the integrated Script editor, you can create scripts for
object events or independent scripts.

Choosing an object or event for scripting

To write a script for an object event:

1. In
   the rightmost drop-down list, select a scripting language.

2. In
   the Script toolbar, select an object in the leftmost drop-down list.

   The object list box lists all client and server
   scripts you create. In addition, it lists all scriptable HTML objects
   (objects for which events are triggered).

3. In the center drop-down list, select an event.

   If the object you have selected is an independent script and
   does not have events, the list box is blank. If you have enabled
   the 4GL event model, server-side events are listed in blue.

The script you write is saved in the HTML page, associated
with the HTML object and its event attribute.

Assigning an ID to an object in the document

A Web
target assigns default IDs when you create commonly scripted objects. You
can assign or change the ID for any object from Page view or Source
view of the HTML editor.

To assign or change an ID:

1. Right-click
   the object and select the Properties menu item for the element from
   the pop-up menu

   or

   Select the HTML element and select Edit>Properties
   from the menu bar.

2. In the ID For Scripting text box, type a new value
   for the object.

IDs for style definitions You can assign IDs for style definitions in the Style Sheet
editor.

Creating a new script

When you select New
Script from the pop-up menu in the integrated Script editor, the
script is inserted in the Body section, after any existing scripts.
If the script needs to be in the Head section, you can switch to
Source view and move the script. In Source view, you can insert
scripts anywhere in the document.

To create a new top-level script in the HTML document:

1. Right-click in the script editor.

2. Select New Script from the pop-up menu and choose
   Server or Client from the cascading menu.

3. If you select Server, choose the target application
   server from the cascading menu.

   Your choice of server affects the type of delimiter used for
   the script. When you choose Web Target and then create a script
   using the Web Target object model, you can deploy the page to any
   supported server type.

   For information about writing server scripts, see Chapter 7, “Working with Application
   Servers and Transaction Servers” and Chapter 9, “Developing 4GL JSP Pages”

To create a script in a separate file:

1. Select File>New
   from the menu bar.

2. In the New dialog, click the Web tab.

3. On the Web tab page, double-click the Script icon.

   The Web Script editor displays in its own window, not as a
   pane within the HTML editor.

Writing the code

The Web Target script
editors provide many techniques to help you write scripts easily.
You can:

• Build syntax using the System Tree
• Use InstaCode to complete object names and select
  from property lists (integrated Script editor only)
• Save and reuse syntax with the Clip window
• Copy and paste, including pasting text with generated
  document.write statements
• Use code in external files

System Tree

The
Language page of the System Tree lists objects and language syntax
for several scripting languages.

The Current page of the System Tree lists the objects in the
HTML document. The standard objects are listed along with any objects
to which you have attached an ID. The Current page is empty if you
are working in the standalone Web Script editor.

To insert a language element or object from the
System Tree into a script editor:

1. Drag the item to the editor, which inserts
   the fully qualified object name or property at the cursor position

   or

   Right-click an item in the System Tree, choose
   Copy from the pop-up menu, and paste the item (ctrl + v)
   into the script editor.

InstaCode

InstaCode helps you
write code by providing a list of objects, properties, and methods
that are appropriate completions to code you have started to type.
As you type in the script editor, you can press F2 to get a list
of suggestions.

InstaCode completes code in two ways:

• When
  you type part of an object name, press F2 to
  see a list of all the objects that begin with those letters.
• When you type the dot after an object
  name, press F2 to see a list of properties and methods
  for that object.

The list of suggestions depends on the context. In a client
script, you see objects belonging to the document object model and
objects you have inserted in the HTML page, such as HTML elements
and components. In a server script, you see objects belonging to
the object model for the selected server.

To use InstaCode:

1. Type part of an object name and press F2.

2. Select an item from the list. (To close the list
   without making a selection, press esc or click
   the close box.)
   • To select using keystrokes:
     
     Use the arrow keys
     or press a letter key to highlight an item.
   • Press enter to insert the item
     in the document and close the window.

To select using the mouse:

Click to highlight
an item.

Double-click to insert that item in the document
and close the list.

Examples

To insert the window object and the alert method
in a client script:

1. On a blank line or after a space, type
   “w” and press F2.

2. Select “window” from the list.

3. Type “.”
   after “window” and press F2.

4. Select “alert(message)” from the list.

The script now contains the code “window.alert(message)”.
Edit the method argument if necessary.

To insert the scroll method for the window object
in a client script:

1. On a blank line or after a space, type
   “s” and press F2. Because window
   is the default object, the list displays window methods and properties.

2. Select “scroll(x,y)” from the list.

The script now contains the code “scroll(x,y)”.

To insert the Write method for the psDocument
object in a server script:

1. On a blank line or after a space, type
   “ps” and press F2.

2. Select “psDocument” from the list.

3. Type “.”
   and press F2.

4. Select “Write(string)” from the list.

The script now contains the code “psDocument.Write(string)”.

Code in external files

You can
reuse code by copying it into another file or by referring to the
code in a separate file through the SRC attribute for the SCRIPT
element.

To get code from a file and insert it in a Web
Target Script editor:

1. Select Insert From File from the pop-up
   menu. The code appears in the script editor, and there is no further
   connection with the original file.

Scripts in HTML documents can be stored in external files,
rather than in the HTML document. When the browser sees an SRC reference
in a SCRIPT tag, it requests the script file from the server.

To put a script saved in the page into an external
file:

1. Right-click in the integrated Script editor
   and choose Save As External Script from the pop-up menu.

2. In the Save dialog, you can include the external
   file in the target by saving the file in the local directory for
   the Web target.

To associate the script with code in an existing
external file:

1. Right-click in the integrated Script editor
   and choose New Script. Choose Client for the type of script.

2. Switch to Source view and add an SRC attribute
   to the SCRIPT element.

   For the value of the SRC attribute, you can assign:

   • A relative path to specify a file in
     the target:
     PowerBuilder

     <SCRIPT LANGUAGE=JavaScript SRC="../../common/frameset/test.js"></SCRIPT>

     1	<SCRIPT LANGUAGE=JavaScript SRC="../../common/frameset/test.js"></SCRIPT>

   • An absolute path to any file (such a path might
     not be valid when you deploy the target)

The HTML editor recognizes the reference to the external file
and displays the code in the integrated Script editor (when the
script object is selected in the first drop-down list) as if it
were part of the HTML document. The icon next to the object name
in the drop-down list displays an additional image (of a paper sheet
with a folded-back corner) to indicate that the script is saved
separately.

To reference a server script that is stored in a separate
file, you need to use the PSIMPORT tag. For more information on
the PSIMPORT tag, see the Web and JSP Target Reference
.

Finding and changing code

To find or replace text in the current script:

1. Click inside the script that you want to
   search.

2. Select Edit>Find or Edit>Replace
   from the PowerBuilder menu.

   Settings in the Find and Replace dialog boxes let you control
   the direction of the search. You can also select options restricting
   searches to whole words only or to strings matching the case of
   the search text.

If you need to find or replace text across many scripts on
a page, switch to Source view. The Find and Replace dialog boxes
look through all the scripts in a single pass.

Searches for special characters The Web Target Script editors do not support searching for
special characters, such as line breaks and tabs.

Setting default formats for scripts in the Script editor

You can specify the font size, text colors, and how the tab
key behaves for the the Script editor (as well as the Source view).

To configure the editor:

1. With a page open in the HTML editor, select
   Design>Options from the menu bar.

2. On the Editors tab, select Script Editor in the
   Windows list box and change settings as appropriate.

   You can make only minimal style selections for the Script
   editor, determining tab size and indent size, and whether to maintain
   tabs for blank space. You can also add or delete scripting languages
   for the Script editor. The Source view allows you to format individual
   HTML elements.

3. Click the Colors/Fonts tab, select a
   view in the Windows list box, and change the color and font setting
   as appropriate.

   You can change colors and fonts for both the Script editor
   and the Source view.

For more information about applying formatting to text, see “Formatting HTML source display”.

---