Power Builder 8 Getting Started
Power Builder 8 Getting Started
PowerBuilder
8
DOCUMENT ID: 37772-01-0800-01
To order additional documents, U.S. and Canadian customers should call Customer Fulfillment at (800) 685-8225, fax (617) 229-9845.
Customers in other countries with a U.S. license agreement may contact Customer Fulfillment via the above fax number. All other
international customers should contact their Sybase subsidiary or local distributor. Upgrades are provided only at regularly scheduled
software release dates. No part of this publication may be reproduced, transmitted, or translated in any form or by any means, electronic,
mechanical, manual, optical, or otherwise, without the prior written permission of Sybase, Inc.
Sybase, the Sybase logo, ADA Workbench, Adaptable Windowing Environment, Adaptive Component Architecture, Adaptive Server,
Adaptive Server Anywhere, Adaptive Server Enterprise, Adaptive Server Enterprise Monitor, Adaptive Server Enterprise Replication,
Adaptive Server Everywhere, Adaptive Server IQ, Adaptive Warehouse, AnswerBase, Anywhere Studio, Application Manager,
AppModeler, APT Workbench, APT-Build, APT-Edit, APT-Execute, APT-FORMS, APT-Translator, APT-Library, Backup Server,
ClearConnect, Client-Library, Client Services, Data Pipeline, Data Workbench, DataArchitect, Database Analyzer, DataExpress,
DataServer, DataWindow, DB-Library, dbQueue, Developers Workbench, Direct Connect Anywhere, DirectConnect, Distribution
Director, E-Anywhere, E-Whatever, Embedded SQL, EMS, Enterprise Application Studio, Enterprise Client/Server, Enterprise Connect,
Enterprise Data Studio, Enterprise Manager, Enterprise SQL Server Manager, Enterprise Work Architecture, Enterprise Work Designer,
Enterprise Work Modeler, EWA, Financial Fusion, Financial Fusion Server, Gateway Manager, ImpactNow, InfoMaker, Information
Anywhere, Information Everywhere, InformationConnect, InternetBuilder, iScript, Jaguar CTS, jConnect for JDBC, KnowledgeBase,
MainframeConnect, Maintenance Express, MAP, MDI Access Server, MDI Database Gateway, media.splash, MetaWorks, MySupport,
Net-Gateway, Net-Library, ObjectConnect, ObjectCycle, OmniConnect, OmniSQL Access Module, OmniSQL Toolkit, Open Client,
Open ClientConnect, Open Client/Server, Open Client/Server Interfaces, Open Gateway, Open Server, Open ServerConnect, Open
Solutions, Optima++, PB-Gen, PC APT Execute, PC DB-Net, PC Net Library, Power++, power.stop, PowerAMC, PowerBuilder,
PowerBuilder Foundation Class Library, PowerDesigner, PowerDimensions, PowerDynamo, PowerJ, PowerScript, PowerSite,
PowerSocket, Powersoft, PowerStage, PowerStudio, PowerTips, Powersoft Portfolio, Powersoft Professional, PowerWare Desktop,
PowerWare Enterprise, ProcessAnalyst, Report Workbench, Report-Execute, Replication Agent, Replication Driver, Replication Server,
Replication Server Manager, Replication Toolkit, Resource Manager, RW-DisplayLib, RW-Library, S-Designor, SDF, Secure SQL
Server, Secure SQL Toolset, Security Guardian, SKILS, smart.partners, smart.parts, smart.script, SQL Advantage, SQL Anywhere, SQL
Anywhere Studio, SQL Code Checker, SQL Debug, SQL Edit, SQL Edit/TPU, SQL Everywhere, SQL Modeler, SQL Remote, SQL
Server, SQL Server Manager, SQL SMART, SQL Toolset, SQL Server/CFT, SQL Server/DBM, SQL Server SNMP SubAgent, SQL
Station, SQLJ, STEP, SupportNow, Sybase Central, Sybase Client/Server Interfaces, Sybase Financial Server, Sybase Gateways, Sybase
MPP, Sybase SQL Desktop, Sybase SQL Lifecycle, Sybase SQL Workgroup, Sybase User Workbench, SybaseWare, Syber Financial,
SyberAssist, SyBooks, System 10, System 11, System XI (logo), SystemTools, Tabular Data Stream, Transact-SQL, Translation Toolkit,
UNIBOM, Unilib, Uninull, Unisep, Unistring, URK Runtime Kit for UniCode, Viewer, Visual Components, VisualSpeller, VisualWriter,
VQL, WarehouseArchitect, Warehouse Control Center, Warehouse Studio, Warehouse WORKS, Watcom, Watcom SQL, Watcom SQL
Server, Web Deployment Kit, Web.PB, Web.SQL, WebSights, WebViewer, WorkGroup SQL Server, XA-Library, XA-Server and XP
Server are trademarks of Sybase, Inc. 3/01
Unicode and the Unicode Logo are registered trademarks of Unicode, Inc.
All other company and product names used herein may be trademarks or registered trademarks of their respective companies.
Use, duplication, or disclosure by the government is subject to the restrictions set forth in subparagraph (c)(1)(ii) of DFARS 52.227-
7013 for the DOD and as set forth in FAR 52.227-19(a)-(d) for civilian agencies.
iii
Contents
Manipulate views............................................................................ 52
Add an extra Script view.......................................................... 53
Display view title bars.............................................................. 54
Float and dock views............................................................... 55
Manipulate tabbed views......................................................... 56
Save a view layout scheme..................................................... 57
Reset the default view layout scheme..................................... 58
Set up the toolbars ......................................................................... 59
Show labels on toolbar buttons ............................................... 60
Float the toolbars..................................................................... 61
Reposition the toolbars............................................................ 63
iv
Contents
v
Contents
vi
Contents
vii
viii
About This Book
Subject This book provides information that enables you to start using
PowerBuilder:
• Part 1 is an overview of the PowerBuilder development
environment
• Part 2 is a tutorial in which you build your first PowerBuilder
application
• Part 3 is a tutorial in which you create a Web target, deploy and run
a Web site, and use Web DataWindows
Audience This book is for anyone building applications using PowerBuilder.
Online Help When you have a question about using PowerBuilder, you can access its
extensive online Help system. In online Help you can see:
• Procedures for accomplishing tasks in PowerBuilder
• Reference information about PowerBuilder topics or components
• Context-sensitive information about PowerBuilder functions or
reserved words in scripts
ix
About This Book
PowerBuilder documentation
How to access The PowerBuilder books are available in several forms:
• Online Books You probably installed them when you installed
PowerBuilder. For information, see Using the Online Books on the
product CD.
• Books on the Web Go to the Sybase Web site at www.sybase.com.
• Selected books in HTML format You can jump to these books
from various topics in online Help.
• Hardcopy books To order a hardcopy documentation set:
• All users Go to the Sybase Web site at www.sybase.com and
navigate to Shop Online.
• Users in North America Call 1-800-8-SYBASE.
• Users outside North America Call your local representative
(phone numbers are listed on the Sybase international Web site at
http://www.sybase.com/contact_us/worldwide/).
The books These are the books in the PowerBuilder documentation set, grouped by
topic:
Topic Book Description
Installation, Installation Guide Tells you how to install
feature guide, and PowerBuilder
tutorial
Building Internet and Provides an overview of the types
Enterprise of applications and components
Applications you build with PowerBuilder and
the features you use to build them
Getting Started Introduces you to PowerBuilder
and provides a tutorial you can
step through to learn the basics
Application User’s Guide Tells how to use the painters to
development build objects in PowerBuilder
Application Presents collections of techniques
Techniques for implementing many common
application features, along with
deployment details and tips for
cross-platform and international
development and deployment
x
About This Book
xi
About This Book
xii
PART 1 Welcome to PowerBuilder
About this chapter This chapter introduces the PowerBuilder development environment,
which you use in the tutorial in Parts 2 and 3. It also describes the building
blocks of a PowerBuilder application.
Contents
Topic Page
What PowerBuilder is 4
The PowerBuilder environment 7
PowerBuilder objects 12
For more information For a more detailed description of the PowerBuilder development
environment, see the PowerBuilder User’s Guide.
3
What PowerBuilder is
What PowerBuilder is
PowerBuilder is an enterprise development tool that allows you to build many
types of applications and components. It is one of a group of Sybase products
that together provide the tools to develop client/server, multitier, and Internet
applications.
What’s in a A PowerBuilder client application can contain:
PowerBuilder
application? • A user interface Menus, windows, and window controls that users
interact with to direct an application.
• Application processing logic Event and function scripts in which you
code business rules, validation rules, and other application processing.
PowerBuilder allows you to code application processing logic as part of
the user interface or in separate modules, called custom class user
objects.
What is a In a multitier application, the modules that contain application processing logic
PowerBuilder can be deployed to a server. You can build components designed to work as
component?
EAServer or COM components.
PowerBuilder In a client application, users control what happens by the actions they take. For
applications are event example, when a user clicks a button, chooses an item from a menu, or enters
driven
data into a textbox, one or more events are triggered. You write scripts that
specify the processing that should happen when events are triggered.
Windows, controls, and other application components you create with
PowerBuilder each have a set of predefined events. For example, each button
has a Clicked event associated with it and each textbox has a Modified event.
Most of the time, the predefined events are all you need. However, in some
situations, you may want to define your own events.
PowerScript language You write scripts using PowerScript, the PowerBuilder language. Scripts
consist of PowerScript commands, functions, and statements that perform
processing in response to an event.
For example, the script for a button’s Clicked event might retrieve and display
information from the database; the script for a textbox’s Modified event might
evaluate the data and perform processing based on the data.
The execution of an event script can also cause other events to be triggered. For
example, the script for a Clicked event in a button might open another window,
triggering the Open event in that window.
4
Chapter 1 Introduction to PowerBuilder
PowerScript functions PowerScript provides a rich assortment of built-in functions that can act on the
various components of your application. For example, there is a function to
open a window, a function to close a window, a function to enable a button, a
function to update the database, and so on.
You can also build your own functions to define processing unique to your
application.
Object-oriented Each menu or window you create with PowerBuilder is a self-contained
programming with module called an object. The basic building blocks of a PowerBuilder
PowerBuilder
application are the objects you create. Each object contains the particular
characteristics and behaviors (properties, events, and functions) that are
appropriate to it. By taking advantage of object-oriented programming
techniques such as encapsulation, inheritance, and polymorphism, you can
get the most out of each object you create, making your work more reusable,
extensible, and powerful.
Internet applications If you are using the Enterprise edition of PowerBuilder, you can develop
PowerBuilder applications that run on the Web using Web targets technology.
With Web targets, you can build complex Web pages that can include client-
and server-side scripting, database content, Web DataWindows, and EAServer
components.
In all editions of PowerBuilder, you can use the DataWindow and
PowerBuilder window plugins, the PowerBuilder window ActiveX, and the
DataWindow Web control for ActiveX.
For information about Web targets, see Working with Web Targets. For
information about PowerBuilder plugins, see Application Techniques. For
information about the DataWindow Web control for ActiveX, see the
DataWindow Programmer’s Guide and the DataWindow Reference.
Multitier applications PowerBuilder lets you build applications that run in a distributed computing
environment. A multitier application lets you:
• Centralize business logic on servers (EAServer or MTS)
• Partition application functions between the client and the server, thereby
reducing the client workload
• Build scalable applications that are easy to maintain
For information about multitier applications, see the sections on distributed
application techniques in Application Techniques.
5
What PowerBuilder is
Database connectivity PowerBuilder provides easy access to corporate information stored in a wide
variety of databases. Data can be accessed through the PowerBuilder ODBC or
JDBC interfaces, through a middle-tier data access server like the Sybase
DirectCONNECT server, or through a native or direct connection to a
database.
For information on database connectivity, see Connecting to Your Database.
Online Help and PowerBuilder online Help can be accessed through interface Help buttons and
documentation menu items, or by selecting the F1 key from anywhere in PowerBuilder. There
are jumps in several places from the online Help to books in HTML format.
Manuals are also available on the Sybase Web site.
6
Chapter 1 Introduction to PowerBuilder
System Tree The System Tree window can serve as the hub of your development activities.
You use it to open, run, debug, and build your targets, and for drag-and-drop
programming.
Clip window The Clip window lets you store code fragments that you use frequently.
Output window The output of a variety of operations (migration, builds, deployment, project
execution, object saves, and searches) displays in an Output window at the
bottom of the main window.
7
The PowerBuilder environment
Painters Once you have created a workspace and a PowerScript target, you build the
components of the target using painters. Painters provide an assortment of
tools for building objects.
PowerBuilder provides a painter for each type of object you build. For
example, you build a window in the Window painter. There you define the
properties of the window and add controls, such as buttons and textboxes.
Editors For Web targets, PowerBuilder provides HTML, style sheet, and frame set
editors. In the HTML editor you can edit pages in source or display format and
preview the results. You can use a standalone script editor or one that is built
into the HTML editor.
Wizards Wizards simplify the creation of applications, objects, components, Web sites,
and Web pages.
Design-time controls Design-time controls (DTCs) create basic HTML and scripts from information
you provide in property sheets. The property sheets display when you drop a
DTC on a Web page in the HTML editor.
The Web DataWindow DTC provides an easy way to access a database from a
Web page. It displays dynamic database content in a variety of presentation
styles and supports inserts, updates, and deletes against the database.
To-Do List The To-Do List displays a list of development tasks you need to do for the
current target. Entries on the To-Do list can be created automatically by most
PowerBuilder wizards. You can also type in entries or import them from a text
file and then link them to a task that you want to complete.
Browser The Browser lets you see all the objects, methods, variables, and structures that
are defined for or available to your PowerScript target. Objects in the Browser
can be displayed in alphabetic or hierarchical order. The Browser displays
methods with their complete signatures, including the data types of all
arguments and return values.
PowerBar The PowerBar displays when you begin a PowerBuilder session. The
PowerBar is the main control point for building PowerBuilder applications.
You can use the New, Inherit, or Open buttons on the PowerBar to open all of
the PowerBuilder painters. From the PowerBar, you can also open the Browser,
debug or run the current application, and build and deploy the workspace.
PainterBar When you open a painter or editor, PowerBuilder displays a new window that
has a workspace in which you design the object you are building. PowerBuilder
also displays one or more PainterBars with buttons that provide easy access to
the tools available in the painter or editor.
8
Chapter 1 Introduction to PowerBuilder
StyleBar The StyleBar displays when you open any painter that can contain text
controls, such as the Window painter. Using buttons on the StyleBar, you can
modify text properties such as the font and point size.
PowerTips When you leave the mouse pointer over a button for a second or two,
PowerBuilder can display a brief description of the button (a PowerTip). The
ability to display PowerTips is toggled on and off by selecting the Show
PowerTips menu item in any toolbar popup menu.
You can also include brief descriptive texts on all toolbar buttons by selecting
ShowText from any toolbar popup menu.
Customizing the In addition to displaying text in toolbar buttons, you can move the toolbars
environment around, add new toolbars, and customize existing ones. You can add buttons
for opening painters and performing other activities.
You can also rearrange the System Tree, Clip, and Output views, set up custom
layouts for each painter, choose whether PowerBuilder opens your last
workspace at startup with or without painters and editors open, customize
shortcut keys, and change the colors and fonts used in scripts.
PowerBar buttons The buttons in the PowerBar give you quick access to the most common
PowerBuilder tasks:
Button Use to
Create new workspace, target, component, or other object, or open a
tool
9
The PowerBuilder environment
Button Use to
Show or hide the Output window
Display a list of development tasks you need to do. These can be self
entered or entered automatically by PowerBuilder wizards
Edit a file
10
Chapter 1 Introduction to PowerBuilder
Button Use to
Stop a build or deploy operation or series of operations
11
PowerBuilder objects
PowerBuilder objects
The basic building blocks of a PowerScript target are objects:
Object Use
Application Entry point into an application
Window Primary interface between the user and a PowerBuilder
application
DataWindow Retrieves and manipulates data from a relational database or
other data source
Menu List of commands or options that a user can select in the
currently active window
Global function Performs general-purpose processing
Query SQL statement used repeatedly as the data source for a
DataWindow object
Structure Collection of one or more related variables grouped under a
single name
User object Reusable processing module or set of controls, either visual or
nonvisual
Pipeline Reproduces data within a database or across databases
Project Packages application for distribution to users
These objects are described in more detail in the sections that follow.
Application object The Application object is the entry point into an application. It is a discrete
object that is saved in a PowerBuilder library (PBL file), just like a window,
menu, function, or DataWindow object.
The Application object defines application-level behavior, such as which fonts
are used by default for text, and what processing should occur when the
application begins and ends.
When a user runs the application, an Open event is triggered in the Application
object. The script you write for the Open event initiates the activity in the
application. When the user ends the application, the Close event in the
Application object is triggered.
12
Chapter 1 Introduction to PowerBuilder
The script you write for the Close event typically does all the cleanup required,
such as closing a database or writing to a preferences file. If there are serious
errors during execution that are not caught using PowerBuilder’s exception
handling mechanism, the Application object’s SystemError event is triggered.
Windows Windows are the primary interface between the user and a PowerBuilder
application. Windows can display information, request information from a
user, and respond to the user’s mouse or keyboard actions.
A window consists of:
• Properties that define the window’s appearance and behavior (for
example, a window might have a title bar and a Minimize box)
• Events triggered by user actions
• Controls placed in the window
13
PowerBuilder objects
On the left of the window is a DataWindow control with horizontal and vertical
trackbars. On the right is a group box that contains static text controls, edit
mask controls with the SpinControl property on, a check box, and two smaller
group boxes with radio buttons. Under the group box is a command button.
DataWindow objects A DataWindow object is an object that you use to retrieve and manipulate
data from a relational database or other data source (such as an Excel
worksheet or dBASE file).
Presentation styles DataWindow objects also handle the way data is
presented to the user. You can choose from several presentation styles. For
example, you can display the data in a Tabular or a Freeform style.
14
Chapter 1 Introduction to PowerBuilder
There are many ways to enhance the presentation and manipulation of data in
a DataWindow object. For example, you can include computed fields, pictures,
and graphs that are tied directly to the data retrieved by the DataWindow.
Display formats, edit styles, and validation You can specify how to
display the values for each column, and you can validate data entered by users
in a DataWindow object. You do this by defining display formats, edit styles,
and validation rules for columns.
For example:
• If a column can take only a small number of values, you can have the data
appear as radio buttons in a DataWindow so users know what their choices
are.
15
PowerBuilder objects
• If the data includes phone numbers, salaries, and dates, you can format the
display to suit the data.
• If a column can take numbers only in a specific range, you can specify a
simple validation rule for the data. This can spare you from writing code
to make sure users enter valid data.
Web DataWindow You can generate DataWindow objects in HTML and
display them in a browser, using a PowerBuilder component running in either
EAServer or MTS to generate the HTML. One of the lessons in the tutorial
shows you how to use a Web DataWindow in a Web target.
Menus Menus are lists of items that a user can select from a menu bar for the active
window. The items on a menu are usually related. They provide the user with
commands (such as Open and Save As on the PowerBuilder File menu) or
alternate ways of performing a task (for example, the items on the Edit menu
in the Window painter correspond to buttons in the PainterBar).
You can select menu items with the mouse or with the keyboard, or use
accelerator (mnemonic access) keys defined for the items. You can define your
own keyboard shortcuts for any PowerBuilder menu item from a dialog box
that you open with the Tools>Keyboard Shortcuts menu item.
A dropdown menu is a menu under an item in the menu bar. A cascading menu
is a menu that appears to the side of an item in a dropdown menu.
16
Chapter 1 Introduction to PowerBuilder
17
PowerBuilder objects
User objects Applications often have features in common. For example, several applications
might have a Close button that performs a certain set of operations and then
closes the window, or they might have DataWindow controls that perform the
same type of error checking. Several applications might all require a standard
file viewer.
If you find yourself using the same application feature repeatedly, you should
define a user object. You define the user object once and use it as many times
as you need.
User objects can be visual or nonvisual (class). They can be further divided into
standard or custom user objects. Standard user objects, whether visual or
nonvisual, are system objects that are always available with PowerBuilder. You
can also use controls for external visual objects that were created outside
PowerBuilder. The main types of user objects are:
• Visual user objects These are reusable controls or sets of controls that
have a consistent behavior. For example, a visual user object could consist
of several buttons that function as a unit. The buttons could have scripts
associated with them that perform standard processing. Once the object is
defined, you can use it as often as you need.
• Class user objects These are reusable processing modules that have no
visual component. You typically use class objects to define business rules
and other processing that acts as a unit. For example, you might want to
calculate commissions or perform statistical analysis in several
applications. To do this, you could define a class user object. To use a class
user object, you create an instance of the object in a script and call its
functions.
Custom class user objects, which define functions and variables, are the
foundation of PowerBuilder multitier applications.
Libraries You save objects, such as windows and menus, in PowerBuilder libraries (PBL
files). When you run an application, PowerBuilder retrieves the objects from
the library. Applications can use as many libraries as you want. When you
create an application, you specify which libraries it uses.
Projects You can create Project objects that build executable applications and
components you can deploy to a server, as well as proxy objects you use in
EAServer applications.
18
CH A PTE R 2 About the PowerBuilder Tutorial
About this chapter This chapter describes what you will do in the PowerBuilder tutorial and
how to get set up for it.
Contents
Topic Page
Learning to build a client/server application 20
Learning to build a Web application 21
How you will proceed 22
How long it will take 22
What you will learn 23
Setting up for the tutorial 24
19
Learning to build a client/server application
Both windows are master/detail windows: each allows you to display a master
list of rows in a particular table and also see detailed information for each row
in the table. For example, the top half of the Maintain Products window
contains a list of products with a pointer to a single product; the bottom half of
the window displays extra detail for the current product.
Login window The MDI application also includes a login window that allows you to connect
to the database at startup time.
20
Chapter 2 About the PowerBuilder Tutorial
The Web pages enable access to the data sources and display the Web
DataWindows previously created.
PowerBuilder Enterprise
To complete the Web application portion of the tutorial, you must have:
• The Enterprise edition of PowerBuilder
• The Web Target option of PowerBuilder installed
• Access to EAServer
21
How you will proceed
If you want to complete only the Web target lessons, you can use the solution
provided for the first part of the tutorial as a starting point. The solution is in
the Tutorial\Solutions directory.
22
Chapter 2 About the PowerBuilder Tutorial
Building a Web You will learn basic Web target techniques and concepts, including:
application
How to use the To
Web target wizards Design Web pages, add server interaction, and meet other
requirements for working in the browser environment
Script view Define scripts for applications, Web pages, and Web controls
Page View View the WYSIWYG view of the Web target page
This tutorial will not make you an expert in PowerBuilder. Only experience
building real-world applications can do that. It will give you hands-on
experience and provide a foundation for continued growth.
23
Setting up for the tutorial
When you install PowerBuilder, these files are installed in the Tutorial
directory, which is a subdirectory of the PowerBuilder installation directory.
When you have finished the tutorial, you can delete the files.
The Tutorial\Solutions The Tutorial\Solutions directory contains a PowerBuilder library called
directory pbtutor.pbl that contains all the objects and scripts that you create in the first
part of the tutorial, as well as workspace and target files. You can use this
solutions library as a reference while you complete the first part of the tutorial.
You can also use it as a starting point if you want to complete only the Web
application part of the tutorial. See "Getting the files you need for the tutorial"
on page 222.
24
Chapter 2 About the PowerBuilder Tutorial
The Web targets Before you start the Web targets tutorial, you must make sure the following
tutorial tools are installed on your computer:
• Jaguar CTS 3.6.1 or later
• PowerDynamo 3.5.2 or later
• Adaptive Server Anywhere 7.1 or later
• Web targets feature of PowerBuilder
• Internet Explorer 5.5 (including the Microsoft Java VM from the custom
setup)
25
Setting up for the tutorial
26
PART 2 Building a Client/Server
Application
This lesson provides the information you need to start PowerBuilder and
create an application.
In this lesson you:
• Create a new workspace
• Create a target
• Specify an icon for the application
• Change the size of the main window
• Run the application
29
Create a new workspace
The workspace is where you build, edit, debug, and run PowerBuilder targets.
You can build several targets within a single workspace, including Web targets
covered in Part 3 of this tutorial.
Now you start PowerBuilder and create a new workspace.
30
Lesson 1 Starting PowerBuilder
If this is the first time you are opening PowerBuilder 8 on your machine,
you see only a top-level entry in the System Tree to indicate that no
workspace is currently open. Otherwise, the System Tree may show a
workspace with targets and objects in it.
31
Create a new workspace
3 Select Workspace from the Workspace page of the New dialog box.
Click OK.
The New Workspace dialog box displays.
32
Lesson 1 Starting PowerBuilder
Create a target
Where you are
Create a new workspace
> Create a target
Specify an icon for the application
Change the size of the main window
Run the application
Now you create a new target using the Template Application wizard. Based on
the choices you make, the Template Application wizard creates precoded
events, menus, windows, and user objects in addition to the application object.
1 Select New from the File menu and click the Target tab.
or
Right-click MyWorkspace in the System Tree, select New from the
popup menu, and click the Target tab.
The Target page of the New dialog box displays.
3 Click Next until the Specify New Application and Library page
displays.
33
Create a target
5 Click Next.
The Specify Template Type page displays. The MDI Application with
Microhelp radio button is selected. You will create an MDI template
application, so you do not need to change this selection.
About MDI
MDI stands for multiple document interface. In an MDI application, the
main window for the application is called the MDI frame. Using the MDI
frame menu bar, you can open additional windows known as sheet
windows that display inside the frame window.
6 Click Next until the Name MDI Base Sheet, Menu and Service page
displays.
In this tutorial you use the default application type, library search path, and
frame and frame menu names, but you specify a different name for the
MDI base sheet.
34
Lesson 1 Starting PowerBuilder
8 Click Next.
On the Name Individual Sheets page, type w_customers for Sheet 1,
w_products for Sheet 2, and clear the Sheet 3 textbox.
PowerBuilder will generate two windows based on the
w_master_detail_ancestor base sheet, one for customers and one for
products.
35
Create a target
9 Click Next.
Type Maintain Customers as the display name for Sheet 1.
Type Maintain Products as the display name for Sheet 2.
The names you type will display in the title bars of these sheet windows.
36
Lesson 1 Starting PowerBuilder
37
Create a target
38
Lesson 1 Starting PowerBuilder
Now you specify an icon for the application. The icon appears in the workspace
when you minimize the application during execution. PowerBuilder includes
the icon automatically when you create an executable file.
You specify an icon from the Properties view on the Application painter. If the
Properties view is not open, you can open it by selecting View>Properties from
the Application painter menu bar. You can also open a Properties view by
resetting the default view layout scheme.
3 Click Browse.
Navigate to the Tutorial directory.
39
Specify an icon for the application
The tutorial icon displays on the Icon page of the Application property
sheet.
5 Click OK.
Click the Save button in PainterBar1.
Click the Close button in PainterBar1.
40
Lesson 1 Starting PowerBuilder
Now you change the size of the application’s main window. When you run the
application, the main window displays in the position and size that you specify.
41
Change the size of the main window
Now when you run the application, instead of being maximized, the frame
window will have the size that you specify in the next step.
42
Lesson 1 Starting PowerBuilder
Now you run the application to see how it works. At this point the application
does not do very much. By running the application, you can see the windows
and menus that were created for you when PowerBuilder generated the
application based on your choices. You will modify them later.
43
Run the application
7 Select Top.
The toolbar is repositioned at the top of the frame.
44
Lesson 1 Starting PowerBuilder
9 Select File>Exit.
The application closes and you return to the PowerBuilder development
environment.
When you exit and restart PowerBuilder, you may want to have
PowerBuilder in the state it was in when you exited, with the workspace
and painters you were working in open.
10 Select Tools>System Options from the menu bar and then click the
Workspaces tab.
11 Make sure the Reopen Workspace on Startup and the Reload Painters
when Opening Workspace checkboxes are selected.
Click OK.
Now when PowerBuilder starts up, it opens the workspace and the painters
that were open when you exited. If you were coding in PowerBuilder when
you exited, the last script you were working on opens at the last line you
edited.
45
Run the application
46
LE S S O N 2 Customizing the PowerBuilder
Environment
This lesson provides the information you need in order to become familiar
with the PowerBuilder environment and to customize the workspace. This
lesson is optional—you can skip to Lesson 3 if you want to.
In this lesson you:
• Manipulate the System Tree window
• Open an object
• Manipulate views
• Set up the toolbars
47
Manipulate the System Tree window
The Workspace page in the System Tree provides you with an overview of your
work. (The other pages of the System Tree are relevant for Web targets, but not
for PowerScript targets). By expanding the workspace and the objects it
contains, you can see the content and structure of your target.
You can work directly with all the objects in the workspace. For example, you
can edit, run, search, or regenerate a window using its popup menu in the
System Tree. In this exercise you reposition, close, and open the System Tree.
You can reposition the System Tree in relation to the main window using its
drag bar. You can also change the way the System Tree, Clip, and Output
windows are arranged.
1 Click the Output window button in the PowerBar to display the Output
window.
3 Click and hold the drag bar at the top of the System Tree.
Drag the System Tree to position it above, below, or to the right of the
painter workspace.
When you start dragging, a gray rectangular outline of the System Tree
displays. It indicates the area that the System Tree would occupy if you
released the mouse button.
4 When the gray rectangular outline is positioned where you want the
System Tree to display, release the mouse button.
The System Tree displays in the new location.
48
Lesson 2 Customizing the PowerBuilder Environment
5 Close the System Tree by clicking the SysTree button in the PowerBar.
The current workspace remains open, but the System Tree closes. Closing
the System Tree leaves more space for the painter workspace views.
7 Close the Clip and Output windows by clicking their buttons on the
PowerBar or by clicking the small x in the corner of each window.
49
Open an object
Open an object
Where you are
Manipulate the System Tree window
> Open an object
Manipulate views
Set up the toolbars
50
Lesson 2 Customizing the PowerBuilder Environment
51
Manipulate views
Manipulate views
Where you are
Manipulate the System Tree window
Open an object
> Manipulate views
Set up the toolbars
Now you learn to control the location and appearance of PowerBuilder painter
views. You can add views to a painter workspace by selecting them from the
View menu in the workspace menu bar.
You can add multiple views of the same type and you can combine views into
a stack of panes with selection tabs at the bottom. You can resize a view by
grabbing and dragging the separator bars that surround it or that surround
neighboring views in the painter workspace.
These exercises use the Application painter to demonstrate how you can
change the appearance of the painter views, but you can manipulate views in
all painters in the same way.
Now you:
• Add an extra Script view
• Display view title bars
• Float and dock views
• Manipulate tabbed views
• Save a view layout scheme
• Reset the default view layout scheme
52
Lesson 2 Customizing the PowerBuilder Environment
If an existing Script views shows the Open event, a new Script view is
empty. Otherwise it displays the Open event.
53
Manipulate views
1 Move the cursor to the top of the extra Script view you just added.
The view title bar rolls down. It contains a pushpin button on the left and
a maximize/minimize button and a close button on the right. The name of
the view displays at the left of the title bar, next to the pushpin button.
54
Lesson 2 Customizing the PowerBuilder Environment
55
Manipulate views
1 Press and hold the mouse button on the Function List tab.
Drag the tab on to the separator bar that separates the two default
stacks in the Application painter.
Release the mouse button.
When you release the mouse button, the Function List view is no longer
part of a stack. If you drag the tab too far and release it over the right stack
with the Properties view and Non-Visual Object List, the Function List
becomes part of that stack.
2 Press and hold the mouse button on the Function List title bar.
Drag it over the stack from which you separated it.
Release the mouse button when the gray rectangular outline of the
Function List view overlaps the stack.
The Function List view returns to its original stack, but it is added as the
last pane in the stack.
3 Press and hold the mouse button on the Function List tab.
Drag it sideways over the other tabs in the same stack.
Release the mouse button when the small gray rectangular outline
overlaps another tab in the stack of tabbed panes.
The Function List view moves to the position in the stack where you
release the mouse button.
56
Lesson 2 Customizing the PowerBuilder Environment
4 Enter a name for your layout in the text field, click the background of
the dialog box, and then click the x button in the upper right corner of
the dialog box to close it.
Your layout scheme is saved. Now, when you select View>Layouts, you
see your layout listed on the cascading menu.
57
Manipulate views
58
Lesson 2 Customizing the PowerBuilder Environment
59
Set up the toolbars
1 Move the pointer to any button on the PowerBar, but do not click.
The button’s PowerTip displays.
3 Select the Show Text checkbox, then click the Close button.
PowerBuilder displays a label on each of the buttons in the PowerBar and
the PainterBars.
60
Lesson 2 Customizing the PowerBuilder Environment
61
Set up the toolbars
62
Lesson 2 Customizing the PowerBuilder Environment
2 Click Top.
This repositions the PowerBar at the top of the workspace.
63
Set up the toolbars
64
LE S S O N 3 Building a Login Window
65
Create a new window
Now you create a new window for the application. The window you create is a
login window that allows the user to enter a user ID and password and connect
to the database. The login window is a response window.
3 Make sure that the Layout view and the Properties view display in the
Window painter.
You can display these views by selecting them from the View menu. If
they are grayed out in the menu, the views are already displayed in the
painter.
The default view layout scheme contains both views.
66
Lesson 3 Building a Login Window
The rectangle in the Layout view represents the window you are building.
The default properties in the Properties view indicate that the window is
visible and enabled, and has the Main window type. You may need to
scroll down in the Properties view to see the window type.
67
Create a new window
68
Lesson 3 Building a Login Window
10 Click OK.
PowerBuilder saves the new login window. If you expand MyWorkspace,
pbtutor, and pbtutor.pbl in the system tree, you can see w_welcome listed
under it.
69
Add controls to the window
70
Lesson 3 Building a Login Window
Button
appearance Control type Use in tutorial
SingleLineEdit To add user entry textboxes to the login
window
Now you modify the login window you just created by adding controls and
changing some of their properties. You:
• Add a Picture control
• Add StaticText controls
• Specify properties of the StaticText controls
• Add SingleLineEdit controls
• Specify properties of the SingleLineEdit controls
• Add CommandButton controls
• Specify properties of the CommandButton controls
71
Add controls to the window
3 Select the text p_1 in the Name textbox on the General tab of the
Properties view.
Type p_sports in the Name textbox.
This names the Picture control. The prefix p_ is standard for Picture
controls.
72
Lesson 3 Building a Login Window
7 Type 300 in the Width textbox and 250 in the Height textbox.
You change the size of the picture control. You may want to adjust the
picture size again after you preview the window.
73
Add controls to the window
2 Click to the right of the Picture control you added in the Layout view.
A StaticText control displays at the selected location.
3 Right-click the StaticText control and select Duplicate from the popup
menu.
PowerBuilder creates a duplicate of the selected control.
74
Lesson 3 Building a Login Window
2 Select the text st_1 in the Name textbox on the General page of the
Properties view.
Type st_welcome in the Name textbox.
Now the control has a more descriptive name. The prefix st_ is standard
for StaticText controls.
5 Adjust the size of the StaticText control to fit the text you entered.
Keep adjusting the size until you see all of the text you entered.
To adjust the size, drag the upper-right corner of the control toward the
upper-right corner of the window in the Layout view.
You can also adjust the size by entering appropriate values on the Other
page of the Properties view for this control.
75
Add controls to the window
7 Select the second StaticText control you added in the Layout view.
Type st_userid in the Name textbox on the Properties view General
page.
Type User ID: in the Text textbox and press the TAB key.
The text that displays in the control changes.
8 Select the third StaticText control you added in the Layout view.
Type st_password in the Name textbox on the Properties view General
page.
Type Password: in the Text textbox and press the TAB key.
Your changes display in the Layout view.
76
Lesson 3 Building a Login Window
2 Click to the right of the User ID: StaticText control in the Layout view.
A SingleLineEdit control displays where you clicked.
77
Add controls to the window
78
Lesson 3 Building a Login Window
79
Add controls to the window
2 Type cb_ok in the Name textbox on the Properties view General page.
Type OK in the Text textbox.
Select the Default checkbox.
You change the default name of the control to something more descriptive
and add a label to the button. Because you selected the Default checkbox,
the ENTER key triggers the Clicked event for this button.
80
Lesson 3 Building a Login Window
When you place controls in a window, PowerBuilder assigns them a default tab
order. The tab order determines the sequence in which focus moves from
control to control when the user presses the TAB key.
Now you change the tab order for the window you created.
81
Code some Help events and preview the window
Now you use the Script view to add context-sensitive Help messages to the
SingleLineEdit controls that you placed on the login window and you preview
the window. If the Script view is not currently displayed in your Window
painter, you can open it by double-clicking an object in the Layout view.
Using the Script view The Script view has three dropdown listboxes.
The first dropdown listbox displays the list of available controls for the current
object plus the special entries, Functions and Declare. The contents of the
second dropdown listbox depend on the selection in the first dropdown listbox.
The third dropdown listbox contains all ancestor objects of the current object,
if any.
Selection in first Contents of second Contents of third
dropdown listbox dropdown listbox dropdown listbox
An object or control List of events for the Current object and all its
name selected object or control ancestor objects
Functions List of editable functions. All ancestor objects with
(New Function) displays if functions having the same
no editable functions exist signature as selected function
Declare List of declaration types: Empty
global, shared, and instance
variables, and global and
local external functions
2 Select the Help event in the second dropdown listbox in the Script
view.
82
Lesson 3 Building a Login Window
As you type text in the Script view, notice that PowerBuilder changes the
text colors to show what kind of syntax element you have entered (such as
keywords, variables, and comments).
4 Select sle_password from the first dropdown listbox in the Script view.
Select the Help event in the second dropdown listbox.
PowerBuilder compiles the code you typed for the Help event of the
sle_userid SingleLineEdit textbox. You now add a Help event for the
sle_password SingleLineEdit textbox.
7 Click OK.
A message box prompts you to save your changes.
83
Code some Help events and preview the window
8 Click Yes.
The login window appears as it would at runtime. If you do not like the
window layout, you can change the size, location, and fonts of the window
controls when you go back to the Window painter workspace.
84
Lesson 3 Building a Login Window
Now you add a one-line script to open the login window as soon as the
application starts executing. You add this script to the Open event of the MDI
frame window. This window (w_pbtutor_frame) was created by the Template
Application wizard.
The MDI frame is called by the application Open event. However, because the
login window is a response window, if you call the login from the frame
window, the login window still displays before the frame window.
In this exercise you:
• Modify the frame window Open event
• Compile the script
85
Write the script to open the window
Wizard-generated script
The frame window Open event already has a script associated with it that was
generated by the Template Application wizard. The script creates an instance
of a wizard-generated user object that serves as a sheet (window) manager. The
Open script then calls the ue_postopen event.
The ue_postopen event registers sheet windows with the sheet manager. The
event is posted to the end of the messaging queue for the window and is not
processed until the remainder of the Open script (that you add in this lesson) is
executed.
2 Click OK.
The Window painter opens and displays views of the main application
window in the painter workspace.
If the Script view is not open, you can open it by selecting View>Script in
the workspace menu bar or by double-clicking inside the Layout view.
86
Lesson 3 Building a Login Window
Using comments
A comment in PowerScript is indicated by either two forward slashes (//)
at the start of a single-line comment, or a slash and an asterisk (/*) at the
start and an asterisk and a slash (*/) at the end of a single-line or multiline
comment. Comments are not parsed by the script compiler.
You now modify the Open event script to cause the login window to
display.
6 Type Open the login window on the new line in the Script view.
Click the Comment button in PainterBar2.
Two slashes appear in front of the line you typed—it is changed into a
comment.
87
Write the script to open the window
88
Lesson 3 Building a Login Window
89
Write the script to open the window
90
LE S S O N 4 Connecting to the Database
This lesson shows you how to make the application connect to the EAS
Demo DB database at execution time and how to use the Database painter
to look at the table definitions and database profile for this database.
In this lesson you:
• Look at the EAS Demo DB database
• Run the Connection Object wizard
• Declare a global variable
• Modify the connection information
• Complete the login and logout scripts
• Run the application
91
Look at the EAS Demo DB database
92
Lesson 4 Connecting to the Database
93
Look at the EAS Demo DB database
94
Lesson 4 Connecting to the Database
95
Look at the EAS Demo DB database
3 Click Edit.
PowerBuilder displays the Connection page of the Database Profile Setup
dialog box.
96
Lesson 4 Connecting to the Database
97
Look at the EAS Demo DB database
98
Lesson 4 Connecting to the Database
4 Right-click the customer table and select Add to Layout from the popup
menu.
or
Drag the customer table from the Objects view to the Object Layout
view.
99
Look at the EAS Demo DB database
The Object Layout view shows the two tables you selected.
6 Right-click the title bar of the customer table in the Object Layout view
and select Alter Table from the popup menu.
or
Right-click the customer table in the Objects view and select Alter Table
from the popup menu.
The Columns view displays the column definitions for the table.
100
Lesson 4 Connecting to the Database
The Object Details view for a column has five tabs, one for general
database properties, one for column header information, and the others for
column extended attributes.
101
Run the Connection Object wizard
Now you run the Connection Object wizard to create a connection service
manager that you use to establish the runtime database connection.
The connection service manager is a nonvisual user object. It is nonvisual
because it does not have a graphic representation in the runtime application; it
is a user object because it is a customized object. You use it to perform database
connection processing in a PowerBuilder application.
102
Lesson 4 Connecting to the Database
5 Click Next until the Ready To Create Connection Object page displays.
You accept the default settings for the following items:
Wizard page Option Default selection
Specify Source of Connection Application INI File
Connectivity Source Information
Info
Connection Service n_pbtutor_connectservice
Object
Name Application Application INI File pbtutor.ini
INI File
103
Run the Connection Object wizard
The last wizard page contains a summary of your choices, including the
default selections.
6 Click Finish.
The wizard creates the connection service object and opens it. It also
creates the application INI file. The To-Do List is still open.
104
Lesson 4 Connecting to the Database
You will next examine the new connection service manager and create a global
variable to reference it. A global variable is available to all objects in the
application.
In more complex applications, you might prefer to reference the connection
service manager with local variables. This would release more memory as soon
as the local variable went out of scope. But in the tutorial, you should keep an
instance of the connection service manager available as long as the database
connection is open.
Establishing a connection To make it possible for an application to
connect to the database at execution time, the connection service manager calls
a wizard-generated function to set properties for a Transaction object that
serves as a communications area between the application and the database.
SQLCA Transaction object The connection service manager uses a built-in
nonvisual system object, the SQL Communications Area (SQLCA) object, as
the default Transaction object. The SQLCA object has several default
properties (including database name, login ID, and password) that are
populated by the connection service manager.
If an application communicates with multiple databases, you can create
additional Transaction objects as needed, one for each database connection.
105
Declare a global variable
The default view layout scheme for this painter includes a Script view and
a Declare Instance Variables view as part of a stack of tabbed panes.
106
Lesson 4 Connecting to the Database
You can now verify that the value of the is_connectfrom variable is 1.
107
Declare a global variable
108
Lesson 4 Connecting to the Database
You can now call the connection service manager to establish a database
connection, but you should open a database connection only if the user enters
a valid ID and password in the login window. You will therefore add the
connection service call to the Clicked event of the OK button on this window,
substituting user-entered information for information from the pbtutor.ini file.
Before you do that though, you remove or comment out the ProfileString calls
that the connection service manager makes to get user ID and password
information from the INI file. Then you modify the DBParm parameter in the
pbtutor.ini file, because it includes hard-coded user ID and password values
that were copied from the pb.ini file.
In this exercise you:
• Modify the of_GetConnectionInfo function
• Call the connection service manager
109
Modify the connection information
110
Lesson 4 Connecting to the Database
111
Modify the connection information
112
Lesson 4 Connecting to the Database
113
Modify the connection information
You still need to code the Clicked event to instantiate the Transaction
object with user-entered connection information.
114
Lesson 4 Connecting to the Database
Earlier in this lesson, you called the connection service manager from the
Clicked event for the login window OK button. Next you add code to the same
Clicked event to instantiate the Transaction object with information entered by
the user.
You also add code to the login window Cancel button Clicked event and to the
application Closed event.
115
Complete the login and logout scripts
1 Select Design>Options from the menu bar and click the AutoScript tab.
5 Expand the Go To node in the Edit menu and select Next Marker.
Type CTRL+M in the shortcut box.
Click OK.
Now whenever you want help completing code, you can press
CTRL+SPACE to pop up a list of possible completions. If you paste in a
statement or function with comments, you can press CTRL+M to move to
the next comment.
116
Lesson 4 Connecting to the Database
1 Make sure you are looking at the Clicked event script for the cb_ok
control.
This is the script in which you added the call to the Connection Service
object.
//Assignment statements
ls_userid = Trim ( sle_userid.text )
ls_password = Trim ( sle_password.text )
ls_database = "ConnectString=’DSN=EAS Demo DB V4;"
You declare local variables here and assign them values. Do not use blank
spaces around the = signs in the ConnectString text.
The Trim function removes leading and trailing spaces from the user ID
and password values passed as arguments to the function from the
SingleLineEdit boxes on the login window.
117
Complete the login and logout scripts
3 Click after the lines you just added (and after the CREATE statement)
but before the IF-THEN statement.
Type the following lines:
//Instantiate with user-entry values
SQLCA.userid = ls_userid
SQLCA.dbpass = ls_password
SQLCA.dbparm = ls_database + "UID=" + &
ls_userid + ";PWD=" + ls_password + "’"
These lines instantiate SQLCA parameters with values from the
SingleLineEdit textboxes.
The lines must be added to the script after the CREATE statement to keep
them from being overwritten with blank values from the Constructor event
of the connection service manager. They must be added before the IF-
THEN statement or their values are not used by the Transaction object
when it is called by the of_ConnectDB function of the connection service
manager.
118
Lesson 4 Connecting to the Database
119
Complete the login and logout scripts
5 Type the following line below the comment you typed (you can use
AutoScript to complete the variable name and the function name):
gnv_connect.of_DisconnectDB ( )
120
Lesson 4 Connecting to the Database
8 Click Yes.
You save your changes and close the Application painter.
121
Run the application
3 Click OK.
The database connection is established and the MDI frame for your
application displays.
122
LE S S O N 5 Modifying the Ancestor Window
In this lesson you modify the ancestor sheet window that you generated
with the Application Template wizard. You:
• Add DataWindow controls to the ancestor sheet window
• Add user events and event scripts
• Add scripts to retrieve data for the DataWindow controls
• Rebuild library objects
123
Add DataWindow controls
Now you open a window that you generated with the Template Application
wizard and add DataWindow controls to it. The window you modify was
generated as the ancestor to the sheet windows: w_customers and w_products.
Tutorial design strategy In a typical application you would add an
extension layer object between the ancestor basesheet and the descendent sheet
windows. You would then modify the extension layer object rather than the
basesheet, giving your application the flexibility to open sheet windows
inherited from different extension layer objects that all inherit, in turn, from the
same basesheet.
However, since this tutorial uses only one type of sheet window, it foregoes the
use of this superior design strategy in the interests of brevity and rapid
deployment. The modifications to the tutorial application are made directly to
the basesheet (ancestor window).
Using a predefined user object The DataWindow controls you add to the
ancestor window inherit their definitions from a user object that was created
for the tutorial application. The user object is a customized DataWindow
control that includes scripts to perform standard database error checking.
The user object is provided in a PBL file that is installed with PowerBuilder.
All you need to do to use this user object is to include its PBL in the library
search path and place it in the ancestor window.
124
Lesson 5 Modifying the Ancestor Window
125
Add DataWindow controls
2 Click Browse.
The Select Library dialog box displays.
126
Lesson 5 Modifying the Ancestor Window
4 Click OK.
127
Add DataWindow controls
2 Click the Layout tab in the stack of panes to display the window.
128
Lesson 5 Modifying the Ancestor Window
129
Add DataWindow controls
6 Select the text dw_1 in the Name textbox in the Properties view.
Type dw_master in the Name textbox.
Select the Vscroll Bar checkbox.
130
Lesson 5 Modifying the Ancestor Window
3 Make sure that the new control is selected in the Layout view.
The Properties view displays the properties of the selected control.
4 Select the text dw_1 in the Name textbox in the Properties view.
Type dw_detail in the Name textbox.
PowerBuilder changes the name of the control to dw_detail.
131
Add DataWindow controls
2 Select dberror from the second dropdown listbox in the Script view.
This script is also empty, but a script icon next to the event name is purple.
This indicates that the ancestor control (u_dwstandard) has an associated
script.
132
Lesson 5 Modifying the Ancestor Window
133
Add user events and event scripts
Windows, user objects, and controls have predefined events associated with
them. Most of the time, the predefined events are all you need, but there are
times when you want to declare your own events. Events that you define are
called user events.
Purpose of user events One reason to define a user event is to reduce
coding in situations where an application provides several ways to perform a
particular task. For example, a task like updating the database can be
performed by clicking a button, selecting a menu item, or closing a window.
Instead of writing the code to update the database in each of these places, you
can define a user event, then trigger that user event in each place you update
the database.
Now you define some user events to handle retrieval, insert, update, and delete
operations against the tutorial database. You make these changes in the Script
view of the Window painter. Later in the tutorial, you add code in the Menu
painter to trigger these events.
134
Lesson 5 Modifying the Ancestor Window
The first button to the right of the third dropdown listbox is a toggle switch
that displays or hides the Prototype window.
As soon as you click in the script area, the text in the second dropdown
listbox of the Script view changes from New Event to ue_retrieve. It has
no arguments and does not return a value.
The script lines you enter execute the Retrieve function and place the
retrieved rows in the dw_master DataWindow control. If the retrieval
operation succeeds, the script sets the focus to the first row in the
DataWindow control and establishes the hand pointer as the current row
indicator.
135
Add user events and event scripts
136
Lesson 5 Modifying the Ancestor Window
What the scripts do The first line of the script for the ue_insert event
clears the dw_detail DataWindow control. The second line inserts a new
row after the last row in the DataWindow (the argument zero specifies the
last row). The third line positions the cursor in the dw_detail control.
The ue_insert and ue_delete events operate on the DataWindow buffer, not
on the database. When these events are triggered, a row is not inserted or
deleted from the database unless the Update function is also called (the
ue_update event calls this function). If the Update function returns the
integer 1, changes made to the buffer are committed to the database. If it
returns a different integer, changes to the buffer are rolled back.
In the script for the ue_delete event, the argument zero in the DeleteRow
function specifies that the current row in the dw_detail control be deleted.
137
Add scripts to retrieve data for the DataWindow controls
The scripts you just typed have no effect on the dw_master DataWindow
control, but now that you have a script for the ue_retrieve event, you need only
trigger this event to retrieve data into the dw_master DataWindow.
You trigger the ue_retrieve event from the sheet window Open event. This
retrieves data into the dw_master DataWindow as soon as the window (or one
of its descendent windows) opens. Then you add a script for the
RowFocusChanged event of dw_master to retrieve data into the dw_detail
DataWindow. The RowFocusChanged event is triggered each time the focus is
changed inside the dw_master DataWindow.
Here is how the script works for the w_master_detail_ancestor window and its
descendants when you are done:
• When a sheet window first opens, a list (of all customers or products)
displays in the top DataWindow control. Detail information for the first
item in the list displays in the bottom DataWindow control.
• When a user moves through the list in the top DataWindow control using
the UP ARROW and DOWN ARROW keys or by clicking in a row, the details
for the current row display in the bottom DataWindow control.
1 Select open from the second dropdown listbox in the Script view for
w_master_detail_ancestor.
The Open event calls the ue_postopen event and posts it to the end of the
window’s message queue. You modify the ue_postopen event later.
138
Lesson 5 Modifying the Ancestor Window
2 Type these new lines in the script area below the call to the
ue_postopen event:
dw_master.settransobject ( sqlca )
dw_detail.settransobject ( sqlca )
this.EVENT ue_retrieve()
The first two lines tell the dw_master and dw_detail DataWindows to look
in the SQLCA Transaction object for the values of the database variables.
The third line triggers the ue_retrieve event. The pronoun This refers to the
current object. In this example, the w_master_detail_ancestor window is
the current object.
4 Type this line in the script area for the RowFocusChanged event:
long ll_itemnum
This line declares the local variable ll_itemnum (l is a letter, not a number),
which has the long data type.
5 Type this line below the variable declaration line you just typed:
ll_itemnum = this.object.data[currentrow, 1]
This line uses a DataWindow data expression to obtain the item number in
column 1 of the currently selected row of dw_master. It stores the number
in the variable ll_itemnum.
139
Add scripts to retrieve data for the DataWindow controls
6 Type these lines below the data expression line you just typed:
IF dw_detail.Retrieve(ll_itemnum) = -1 THEN
MessageBox("Retrieve","Retrieve error-detail")
END IF
This group of lines sends a retrieval request to the dw_detail DataWindow
along with the argument the DataWindow expects (an ID number stored in
the ll_itemnum variable). The IF statement that encloses the Retrieve
function checks for successful completion. If the retrieval operation fails,
it displays an error message box.
140
Lesson 5 Modifying the Ancestor Window
It is a good idea to rebuild all your objects after modifying an ancestor object.
You do this now from the popup menu for the workspace object in the System
Tree.
2 Close the Output view by clicking the Output button in the PowerBar.
141
Rebuild library objects
142
LE S S O N 6 Setting Up the Menus
In this lesson you set up the menus for the application. You:
• Modify the frame menu
• Create a new sheet menu
• Add menu scripts to trigger user events
• Attach the new menu and run the application
Menus are separate objects that you create using the Menu painter. After
you create a menu, you can attach it to as many windows as you want. You
can create menus at any time during the application development process.
143
Modify the frame menu
144
Lesson 6 Setting Up the Menus
145
Modify the frame menu
4 Make sure that &Report appears in the Text box in the Properties view.
Click the Toolbar tab in the Properties view.
The toolbar item text is New, Open New Sheet. There is no selection in the
ToolbarItemName box, so no toolbar button appears at runtime for the
Report menu item. You do not add a toolbar button here, because you use
the Report menu item to access cascading menu items rather than as a
command to open a new sheet.
5 Click the Open menu item under the File menu in the WYSIWYG view.
Click the General tab in the Properties view.
Clear the Visible checkbox on the General page of the Properties view.
Clear the Enabled checkbox on the General page of the Properties
view.
You hide this item in all runtime menus. When you clear the Visible
property, the WYSIWYG view displays the menu item with a dithered
appearance. It is not be visible at runtime.
146
Lesson 6 Setting Up the Menus
1 Double-click the Help Index menu item in the Help menu in the
WYSIWYG view.
or
Select m_help.m_helpindex in the first listbox in the Script view.
The full name of the Help Index menu item includes the m_help prefix to
indicate that it is in the Help menu.
3 Position the cursor in the line that contains the ShowHelp function
and click the Uncomment button in the PowerBar.
Change myapp.hlp to pbtutor.hlp:
ShowHelp ("pbtutor.hlp", Index!)
This displays the default topic in the Help file.
4 Check the Enabled box on the General page in the Properties view.
5 Repeat the preceding steps for the Search for Help On menu item.
The ShowHelp call looks like this:
ShowHelp ("pbtutor.hlp", Keyword!, "")
If the third argument in this call contained a string that was a keyword in
the Help file, the associated topic would display. Because the argument is
an empty string, the Help Search window displays.
147
Modify the frame menu
148
Lesson 6 Setting Up the Menus
Now you create a new menu that displays whenever the user opens an MDI
sheet to look at customer or product information. The menu you create is a
descendant of the m_pbtutor_sheet menu that was generated by the Template
Application wizard.
The m_pbtutor_sheet menu inherits in turn from m_pbtutor_frame, but has
some additional menu items enabled. In the menu you create, you add menu
items that are not present in the ancestor menus.
In this exercise you:
• Inherit and save a new menu
• Add items to the new menu
• Add a new toolbar for the new menu items
149
Create a new sheet menu
5 Click OK.
This names the menu. The prefix m_ is standard for menus.
The name you just assigned to the new menu displays in the title bar of the
Menu painter workspace and the m_my_sheet menu appears in the system
tree.
150
Lesson 6 Setting Up the Menus
1 Click the Edit menu in the WYSIWYG view for the new menu.
The list of Edit menu items appears just as it would in a runtime
application. All items of the Edit menu are visible but disabled (they
appear gray—but not dithered—in the WYSIWYG view).
4 Clear the Enabled checkbox in the Properties view for the new
separator line.
151
Create a new sheet menu
You add Edit menu items for updating and deleting database records. Even
though it is not enabled, the Undo item already uses the letter U as an
accelerator key, so you should not use the same accelerator key for the
Update menu item. Instead, you use the letter A for this purpose.
152
Lesson 6 Setting Up the Menus
1 Click the new Insert menu item in the WYSIWYG view Edit menu.
4 Click the new Update menu item in the WYSIWYG view Edit menu.
Make sure it is also selected in the Properties view.
5 Click the Toolbar tab if the Toolbar page is not already open.
Type Update in the ToolbarItemText box.
Type or select Update! in the ToolbarItemName dropdown listbox.
This defines a toolbar button for the Update menu item that uses the stock
picture called Update!. The button text is Update.
7 Click the new Delete menu item in the WYSIWYG view Edit menu.
Make sure it is also selected in the Properties view.
153
Create a new sheet menu
8 Click the Toolbar tab if the Toolbar page is not already open.
Type Delete in the ToolbarItemText box.
Type or select DeleteRow! in the ToolbarItemName dropdown listbox.
This defines a toolbar button for the Delete menu item that uses the stock
picture called DeleteRow!. The button text is Delete.
154
Lesson 6 Setting Up the Menus
Now you add scripts to trigger user events from the sheet window menu bar.
You added these user events in Lesson 5, "Modifying the Ancestor Window".
The Menu painter should still be open for the m_my_sheet menu. If it is not,
you can open it using the Open button in the PowerBar.
3 Repeat steps 1 and 2 for the following menu items and scripts:
Menu name Script for Clicked event
m_edit.m_update w_master_detail_ancestor lw_activesheet
lw_activesheet=w_pbtutor_frame.GetActiveSheet()
lw_activesheet.EVENT ue_update()
m_edit.m_delete w_master_detail_ancestor lw_activesheet
lw_activesheet = w_pbtutor_frame.GetActiveSheet()
lw_activesheet.EVENT ue_delete()
155
Add menu scripts to trigger user events
156
Lesson 6 Setting Up the Menus
Now you attach the new sheet menu and run the application again.
5 Click in the line that declares the data type for lm_menu.
This is the second line below the opening comments in the event script.
The data type declaration is currently:
m_pbtutor_frame lm_menu
157
Attach the new menu and run the application
158
Lesson 6 Setting Up the Menus
159
Attach the new menu and run the application
160
LE S S O N 7 Building DataWindow Objects
The DataWindow object is one of the most powerful and useful features
of PowerBuilder. A DataWindow object can connect to a database,
retrieve rows, display the rows in various presentation styles, and update
the database.
In this lesson you:
• Create and preview a new DataWindow object
• Make cosmetic changes to the first DataWindow object
• Create a second DataWindow object
• Make cosmetic changes to the second DataWindow object
161
About this lesson
Next you create a new DataWindow object and display it in the DataWindow
painter. Like other painters, the DataWindow painter has an assortment of
views that you can open simultaneously.
In the Preview view of the DataWindow painter, you can see how the object
looks in an application at runtime, complete with table data.
162
Lesson 7 Building DataWindow Objects
5 Click id, fname, and lname in the Columns listbox in the order listed.
Scroll down the list and click company_name.
PowerBuilder displays the selected columns in a grid at the bottom of the
Quick Select dialog box.
You can use the grid area at the bottom of the dialog box to specify sort
criteria (for the SQL ORDER BY clause) and selection criteria (for the
SQL WHERE clause). Now you specify sort criteria only. You sort the id
column in ascending order.
6 In the grid area of the Quick Select dialog box, click in the cell next to
Sort and below Id.
A dropdown listbox displays.
163
Create and preview a new DataWindow object
8 Click OK.
The DataWindow wizard asks you to select the colors and borders for the
new DataWindow object. By default, there are no borders for text or for
columns.
9 Click Next.
You accept the border and color defaults. The DataWindow wizard
summarizes your selections.
10 Click Finish.
PowerBuilder creates the new DataWindow object and opens the
DataWindow painter.
In the Design view, PowerBuilder displays a Heading band with default
headings and a Detail band with the columns you selected:
164
Lesson 7 Building DataWindow Objects
165
Save the DataWindow object
Now you name the DataWindow object and save it in the pbtutor.pbl library.
4 Click OK.
PowerBuilder saves the DataWindow object and closes the Save
DataWindow dialog box.
166
Lesson 7 Building DataWindow Objects
Now you can make cosmetic changes to the DataWindow. You reposition the
columns and column headings to make room for the hand pointer, which
displays to the left of the currently selected row. You also move some of the
columns to make them line up with their headings.
You make these changes in the Design view. You can keep the Preview view
open at the same time to see how the changes you make affect the appearance
of the DataWindow at runtime.
167
Make cosmetic changes to the first DataWindow object
8 Click Yes.
PowerBuilder saves the DataWindow object and closes the DataWindow
painter.
168
Lesson 7 Building DataWindow Objects
When you built the first DataWindow object, you used Quick Select to specify
the table and columns. This let you retrieve all the customers without having to
use the Select painter.
To build the second DataWindow object, you use the Select painter. You need
to define a retrieval argument and WHERE criteria so you can pass an
argument to the DataWindow object during execution. In this case, you will
pass the customer ID.
Now you:
• Select the data source and style
• Select the table and columns
• Define a retrieval argument
• Specify a WHERE clause
• View the DataWindow in the DataWindow painter
• Save the DataWindow object
169
Create a second DataWindow object
170
Lesson 7 Building DataWindow Objects
Alternative method
If you double-click the customer table instead of selecting it and clicking
Open, the Select Tables dialog box remains open. In this case, you must
click Cancel to continue.
2 Right-click the header area of the Customer table in the Table Layout
view.
Select Select All from the popup menu.
The column names appear in the Selection List area above the table in the
Table Layout view.
The column order in the Selection List reflects the order in which columns
are selected. Since you selected all the columns at once, the order
displayed is the original order of the columns in the database. You change
the column presentation order later.
171
Create a second DataWindow object
You can also see the order of selection in the Syntax view. Display the
Syntax view by clicking the Syntax tab at the bottom of a stack of tabbed
panes. The Syntax view displays the generated Select statement.
172
Lesson 7 Building DataWindow Objects
3 Click OK.
The retrieval argument is defined.
173
Create a second DataWindow object
174
Lesson 7 Building DataWindow Objects
3 Click Finish.
Because you selected the Retrieve On Preview checkbox and because the
Preview view is part of the default layout scheme for the DataWindow
painter, the Specify Retrieval Arguments dialog box appears.
This dialog box prompts you for an argument value. When you put this
DataWindow object into the tutorial application, you write a script that
passes the required argument to the DataWindow object automatically.
175
Create a second DataWindow object
176
Lesson 7 Building DataWindow Objects
177
Create a second DataWindow object
4 Click OK.
You return to the DataWindow painter.
178
Lesson 7 Building DataWindow Objects
179
Make cosmetic changes to the second DataWindow object
2 Keep the CTRL key pressed and click the following column labels and
column controls:
Label Column
City: city
State: state
Zip Code: zip
4 Use the CTRL+click technique to move the following label and column
controls to the location indicated:
If necessary, scroll down until you can see all the columns in the
DataWindow.
180
Lesson 7 Building DataWindow Objects
181
Make cosmetic changes to the second DataWindow object
2 While the Zip Code: label is still selected, use the CTRL+click technique
to select the Address:, City:, and State: labels.
5 Move the zip column so that it is next to the Zip Code: label.
Align the address, city, and state columns with the zip column, just as
you aligned the column labels.
182
Lesson 7 Building DataWindow Objects
183
Make cosmetic changes to the second DataWindow object
184
LE S S O N 8 Attaching the DataWindow
Objects
After you create and save a DataWindow object, you can use it in a
window. You have already created the d_custlist and the d_customer
DataWindow objects. Now you associate each of these DataWindow
objects with a DataWindow control in the w_customers window.
In this lesson you:
• Attach a DataWindow object to the master DataWindow control
• Attach the DataWindow object to the detail DataWindow control
• Run the application
• Attach DataWindow objects to the Product window
• Run the completed application
185
Attach a DataWindow object to the master DataWindow control
186
Lesson 8 Attaching the DataWindow Objects
187
Attach the DataWindow object to the detail DataWindow control
Now you attach a DataWindow object to the detail DataWindow control. The
Window painter should still be open for the w_customers window.
2 In the Layout view, make the dw_detail control larger so that you can
see all of the columns you added to the DataWindow object.
If you need to, you can also enlarge the window to make more room. If you
make the dw_detail control wider, you may also want to make the
dw_master control the same width.
188
Lesson 8 Attaching the DataWindow Objects
Now you run the application again to test the insert, update, and delete
capabilities of the second DataWindow.
2 Click Yes.
The application begins running, and the login window displays.
189
Run the application
The top DataWindow control (dw_master) shows all of the rows retrieved
from the Customer table. The hand pointer shows which row is selected.
The bottom DataWindow control (dw_detail) shows further information
about the selected customer.
190
Lesson 8 Attaching the DataWindow Objects
191
Attach DataWindow objects to the Product window
Now you add two DataWindow objects to the w_products window. These
DataWindow objects are provided for you in the tutor_pb.pbl library.
1 Right-click w_products in the System Tree and select Edit from the
popup menu.
or
Double-click w_products in the System Tree.
The Window painter displays the w_products window.
192
Lesson 8 Attaching the DataWindow Objects
193
Run the completed application
Now you run the application again to test the Product window.
At this point the Product window should have all of the capabilities of the
Customer window. Like the Customer window, the Product window functions
as a master/detail window, providing support for retrieval, insert, update, and
delete operations against the database.
2 Click Yes.
The application begins running, and the login window displays.
194
Lesson 8 Attaching the DataWindow Objects
195
Run the completed application
196
LE S S O N 9 Running the Debugger
Sometimes your application does not behave the way you think it will.
Perhaps a variable is not being assigned the value you expect, or a script
does not do what you want it to. In these situations, you can closely
examine your application by running it in debug mode.
In debug mode, you can set breakpoints (stops) in scripts and functions,
step through the code line by line, and display the contents of variables to
locate logic errors and mistakes that result in errors during execution.
When you run your application in debug mode, PowerBuilder suspends
execution just before it hits a line containing a breakpoint. You can then
look at and change the values of variables.
In this lesson you:
• Add breakpoints in application scripts
• Run in debug mode
• Set a watch and a conditional breakpoint
197
Add breakpoints in application scripts
Now you open the Debugger and add breakpoints to examine the behavior of
the login and Customer windows. When PowerBuilder runs the application in
debug mode, it stops just before executing a line containing a breakpoint.
When you insert breakpoints in a script, you should select lines that contain
executable statements. If you try to set a breakpoint in variable-declaration
lines, comment lines, or blank lines, PowerBuilder sets the breakpoint at the
next executable line.
198
Lesson 9 Running the Debugger
The source code for the application Open event displays in the Source
view at top left. If it does not display, expand the Application node in the
Source Browser view’s tree view and double-click the Open event under
the pbtutor application.
4 Double-click the Clicked event for the cb_ok button in the Source
Browser view.
The code for the Clicked event displays in the Source view.
199
Add breakpoints in application scripts
200
Lesson 9 Running the Debugger
You should see the breakpoints you set in the Breakpoints view. To
complete this lesson, you need to have these breakpoints set correctly.
201
Run in debug mode
Now you run the application in debug mode. You step through the code line by
line.
202
Lesson 9 Running the Debugger
5 Use Step In or Step Over to step through the code until you reach this
statement in the script for the frame window Open event:
open(w_welcome)
After PowerBuilder finishes executing this statement, the login window
displays and the Debug window is minimized.
The Open event for the frame window also has a posted call to the
ue_postopen function (that you stepped through without examining). This
in turn calls functions of the sheet manager. These functions are processed
at the end of the script for the Open event (after the login window
displays).
203
Run in debug mode
6 Click Step Over until the login window displays and the Debugger is
minimized.
Type dba in the User ID box of the login window.
Type sql in the Password box and click OK.
You return to the Debug window. The yellow arrow in the Source view
points to the next executable statement, the CREATE statement for the
connection service object. This is the first executable line in the script for
the Clicked event of the cb_ok command button.
204
Lesson 9 Running the Debugger
The values were assigned during execution of the Constructor event of the
connection service object after the of_GetConnectionInfo function
returned information from the INI file, but because you commented out the
lines in the code for the UserID, DBPass, and DBParm properties, these
values were not retrieved.
205
Run in debug mode
12 Click again on the Global tab in the lower-left stack and expand the
Transaction object.
Use the Step In button to step through the three lines that instantiate
the Transaction object (SQLCA) with user-entry values.
As you step through each statement, you can check that the values you
entered in the login window are being assigned to the Transaction object.
You are still not connected to the database until the connection service
object of_Connect function is executed.
206
Lesson 9 Running the Debugger
Next you set a watch on a variable whose value changes when the user selects
a row in the Customer window. You then change one of the simple breakpoints
you have set into a conditional breakpoint that is triggered only when a variable
has a specific value.
207
Set a watch and a conditional breakpoint
5 Type the following line in the Condition textbox and click OK:
ll_itemnum = 107
208
LE S S O N 1 0 Preparing the Application for
Deployment
209
Create the Project object
Now you create the PBTUTOR Project object. You can then use the Project
object to create the executable file for the application.
About machine code If you are running PowerBuilder Enterprise, you can
choose between Pcode (pseudocode) and machine code as the compile method
for your project executable file.
When you deploy an application to users, you may want to take advantage of
the execution speed of machine code for some computations, such as loops,
floating point or integer arithmetic, and function calls. While you are
developing the application, you usually use Pcode because it is faster to
generate.
About dynamic libraries You can also create dynamic libraries for your
application. Dynamic libraries can be used to store the objects in the
application. By using dynamic libraries, you can break the application into
smaller units that are easier to manage and also reduce the size of the
executable file.
For small applications like the one that you are working on now, you do not
need to use dynamic libraries.
210
Lesson 10 Preparing the Application for Deployment
3 Click Next.
The Specify Destination Library page displays.
6 If you want to, enter your own version information on the Specify
Version Information page.
If you do not change the information on this page, the defaults display in
Windows Explorer when you look at the properties of the executable.
211
Create the Project object
7 Click Next.
Review the information on the Ready to Create Application page.
Click the Finish button.
PowerBuilder creates a Project object for your application and displays it
in the Project painter workspace.
212
Lesson 10 Preparing the Application for Deployment
Now you create the executable file for your application. The executable file
you generate contains definitions for all the objects in the application. For the
tutorial application, this includes the bitmap file used in the login window,
since you did not include a separate resource file with your project.
You can create the executable in the Project painter, but usually, once you have
defined the project, you do not need to open the painter again.
Workspaces and targets in the System Tree have Incremental Build, Full Build,
and Deploy items on their popup menus that enable you to build and deploy
some or all of the projects in a target or in the whole workspace. Incremental
Build and Full Build compile your code. Deploy compiles the code and, for
applications like the one you built in this tutorial, creates an executable file and
optional dynamic libraries. For other projects, such as server component
projects, Deploy also deploys the component and supporting files to the server.
In this lesson you look at the property sheets where build and deploy options
are specified and then create the executable from the PowerBar.
213
Create the executable file
214
Lesson 10 Preparing the Application for Deployment
Create a shortcut
Where you are
Create the Project object
Create the executable file
> Create a shortcut
Test the executable file
Now you create a shortcut for the executable file. The icon serves as a shortcut
to open the executable file. You can add the shortcut directly to the desktop or
to the program group of your choosing.
1 Minimize PowerBuilder.
PowerBuilder is minimized to an icon on the taskbar.
3 Enter the full path to the EXE file in the Command Line box.
For example, if you accepted the default installation folder, type:
C:\Program Files\Sybase\PowerBuilder 8.0\Tutorial
\pbtutor.exe
You can also click the Browse button and locate pbtutor.exe.
4 Click Next.
5 Type SportsWear, Inc. in the Select A Name For The Shortcut box.
6 Click Finish.
An icon and name display on the desktop.
Now you must modify a property of the shortcut so that you can run the
application. You can also change the icon.
215
Create a shortcut
216
Lesson 10 Preparing the Application for Deployment
1 Make sure the pbtutor.ini file is in the same directory as the pbtutor.exe
executable file.
4 When you have finished testing the application, select File>Exit from
the menu bar.
217
What to do next
What to do next
Congratulations. You have completed the first two parts of the tutorial. Now
you know the basics of application development with PowerBuilder.
If you are a PowerBuilder Enterprise developer, you can continue to the Web
targets lessons.
PowerBuilder books to The Preface to this book includes a guide to the PowerBuilder documentation.
use next To further your education, you should continue with these books:
User’s Guide
Building Internet And Enterprise Applications for PowerBuilder
Application Techniques
DataWindow Programmer’s Guide
Installing the Online All the PowerBuilder books are available in the Online Books and on the
Books Sybase Web site at www.sybase.com.
For information on how to install the Online Books, see the Installation Guide.
218
PART 3 Building a Web
Application
221
Before you begin this tutorial
222
Lesson 11 Creating Web pages
A PowerDynamo Web site is a database repository where you can create, store,
manage and access HTML documents and data. PowerDynamo lets you embed
instructions into a Web page. It processes these instructions when an HTML or
Web client views or interacts with the page. PowerDynamo provides an
application server that links to your database and your Web server, and a
Personal Web server that lets you work off-line with dynamic Web content.
When you deploy to PowerDynamo, the deployment configuration processes
the HTML pages to make them compatible with the format used by the
application server. It updates links in HTML elements to reflect the actual
deployment file structure. This processing includes:
• Mapping the Web target objects used in your server scripts to objects and
methods (object models) on the application server
• Replacing the delimiters in the HTML editor for server scripts (<% and
%>) with the correct delimiters for the specified application server
223
Create a PowerDynamo Web site
3 Click Next.
The Select Target Location and Folders wizard page displays. The default
name for the Web target is Target1.
5 Click Next until the Specify HTTP Server Information page displays.
You accept the default settings for the following items:
Wizard Option Default
URL Prefix Mapping /Customer
ODBC Data Source Name Customer
New Local Database Filename Customer.db
User ID and Password dba, ***
Load PowerDynamo Help Files and No
Samples
Deployment Configuration Name and CustomerDeployConfiguration1
Description Deployment Configuration
6 Type localhost for the HTTP Server Name in the Specify HTTP Server
Information page.
Accept the default port: 80.
Specifying localhost means that the Web site you create is located on your
local machine.
224
Lesson 11 Creating Web pages
7 Click Next until the Ready to Create Dynamo Web Site page displays.
You accept the default settings for the following items:
Wizard option Default
Object Model Default Object Model
Enable Debugging No Debugging
Deploy What Deploy All or Nothing
Rebuild Incremental
Copy Folder Program Files\Sybase\PowerBuilder 8.0\Tutorial
\Customer\CustomerDeployConfiguration1
By accepting the default Web Target object model, you can write server-
side logic that can be deployed to several server platforms from a single
source. The deployment engine converts the source to the appropriate
syntax for these target platforms.
225
Create and modify a basic Web page
In this lesson you create an introductory Web page and modify the look and feel
of the page. Not all functionality is added at this time. The purpose is to
demonstrate how easy it is to create a working Web site.
• Create a 4GL introductory Web page
• Change type face
• Add a graphic
• Add absolute positioning to a graphic
226
Lesson 11 Creating Web pages
Five wizards are available to create Web pages: Quick Web Page, Web
Page, 4GL Web Page, Web DataWindow Page, and Frameset Page. In this
tutorial, you use the Web Page, 4GL Web Page, and Web DataWindow
Page wizards.
3 Click Next.
Type the Title Welcome in the Title textbox and press TAB.
The filename in the File Name textbox defaults to Welcome.htm.
227
Create and modify a basic Web page
5 Click Next until the Define Page Parameters page displays, accepting
the wizard defaults.
Type ID for the Parameter Name and leave the Default value empty.
Click Next.
7 Click Next.
Click Finish.
The wizard creates the new Web page and the page opens in Page view.
The filename is Welcome.htm.
8 In Page view, select the default text Put your data here.
Type:
Welcome to Sportswear Inc.
228
Lesson 11 Creating Web pages
1 Place the cursor at the end of the text and press ENTER.
Place the cursor in the text Welcome to Sportswear Inc.
Right-click and select Paragraph Properties from the dropdown listbox.
Click the Inline Styles tab.
7 Click OK twice.
Your type face changes are applied to the text.
229
Create and modify a basic Web page
Add a graphic
Next you add an image file to the Welcome page.
6 Place the cursor again in the paragraph below the Welcome title.
Select Insert >Image from the menu bar.
7 Click the browse button (...) next to the Image Location textbox.
8 Open the Graphics folder on the Target page of the Choose URL dialog
box.
230
Lesson 11 Creating Web pages
10 Click OK in the Choose URL dialog box, and again in the Image
Properties dialog box.
The white T-shirt (tshirtw.jpg) image displays on the Welcome page.
231
Create and modify a basic Web page
2 Drag the graphic below the heading, centering it under the blue bar.
3 Click the Preview tab to view what the page looks like when deployed.
232
Lesson 11 Creating Web pages
In this lesson you add a new Web page for displaying product information. You
also add a hyperlink to the Welcome page to access this new page. Lastly you
add a button to the new page that eventually navigates to a Web page in which
you can add new product information. Additional features are added to this
Web page in a later lesson.
• Create a product information Web page
• Add a hyperlink
• Add a button
233
Add page navigation
3 Click Next.
Type the Title Product in the Title textbox and press TAB.
The filename in the File Name textbox defaults to Product.htm.
4 Click Next until the Define Page Parameters page displays (accept the
wizard defaults).
Type ID for the Parameter Name and leave the Default Value empty.
Click Next.
234
Lesson 11 Creating Web pages
6 Click Next.
Review the summary of page properties and click Finish.
The Product.htm page displays in Page view.
235
Add page navigation
Add a hyperlink
Next you add a hyperlink in the Welcome page to access the Product Web page.
236
Lesson 11 Creating Web pages
Add a button
Next you add a button to the Product page. Buttons are a typical navigation tool
on Web pages. Later in the tutorial, you add navigation logic to this button.
4 Click OK.
The button displays on the Product.htm page.
You will connect this button to a Web page in the next lesson.
237
Add page navigation
238
Lesson 11 Creating Web pages
Now you add a Login Web page (Login.htm) with 4GL capabilities. The login
page is a simple design. For the purposes of this tutorial, a server-side
validation script determines if the username and password are the same. This
is determined with validation logic. In production applications you want to use
more sophisticated validation logic.
Once the login information has passed validation, you add server redirection to
move the user to the Welcome page.
The username and password are saved as session variables that are valid for the
entire Web session.
In this lesson you:
• Create a basic login page
• Add session variables
• Add single line text controls
• Add password validation
• Add server redirection
239
Create a login page with validation and redirection
1 With the Customer target selected, select File>New from the menu bar.
Click the Web tab.
3 Click Next.
Type the Title Login in the Title textbox and press TAB.
The filename in the File Name textbox defaults to Login.htm.
4 Click Next until the Define Page Parameters page displays (accept the
wizard defaults).
5 Type ID for the Parameter Name and leave the Default Value empty.
Click Next.
240
Lesson 11 Creating Web pages
7 Click Next.
Review the summary of page properties and click Finish.
The Login.htm page displays in Page view.
241
Create a login page with validation and redirection
1 In Page view, highlight the default text Put your data here.
Replace this highlighted text with the following:
Log in, please:
2 Press ENTER.
On a new line, type the following text, pressing ENTER after each line.
Name
Password
3 Right-click the Login.htm page and select Page Properties from the
popup menu.
Click the Variables tab.
4 Click under Variable Name, click again, and type user for the new
variable name.
5 Tab to the Life Time column and select session from the dropdown
listbox.
Tab to the Client Access column and select Read/Write from the
dropdown listbox.
6 Click under user in the Variable Name column, click again, and type
pswd for the new variable name.
242
Lesson 11 Creating Web pages
7 Tab to the Life Time column and select session from the dropdown
listbox.
Tab to the Client Access column and select Read/Write from the
dropdown listbox.
8 Click OK.
Two session variables for the user login information are now defined.
243
Create a login page with validation and redirection
1 On the Login.htm page, place the cursor in the paragraph after the
word Name and type two spaces.
Select Insert>Form Field>Single Line Text from the menu bar.
The Text Control Properties dialog box displays.
2 Type sle_user in the Name textbox and make sure the Server Side
Scriptable checkbox is selected.
4 In the Page view, place the cursor in the paragraph after the word
Password and type two spaces.
Select Insert>Form Field>Single Line Text.
244
Lesson 11 Creating Web pages
245
Create a login page with validation and redirection
1 Place the cursor on the page in the paragraph below the Password
textbox and press ENTER.
Select Insert>Form Field>Push Button from the menu bar.
The Button Properties dialog box displays.
On a 4GL Web page, a submit button type and a standard button type
(button) work in the same way; both have client-side onclick events and
server-side Server Action events.
246
Lesson 11 Creating Web pages
3 Click OK.
The new Login button displays under the Password textbox.
4 In the Script editor at the bottom of Page view, select cb_login in the
first dropdown listbox.
5 In the center dropdown listbox, scroll to the bottom of the list and
select ServerAction().
Server-side events display in blue text.
This script tests to see whether the username and password are the same.
It assigns the client-entered values for username and password to the
session variables.
247
Create a login page with validation and redirection
7 Press ENTER.
Type the following comment line below the script just entered:
//Add Redirection here
You add a redirection call in the next lesson of the tutorial.
248
Lesson 11 Creating Web pages
1 In the Script editor at the bottom of the Login.htm page, place the
cursor after the comment line //Add redirection here.
Right-click and select Insert Redirect from the popup menu.
The Redirect Properties dialog box displays.
3 Click OK twice.
The Script editor inserts a block of code. The ability to modify or remove
this block of code using the Edit Redirect or Delete Redirect commands is
available in the popup menu.
249
Designate a start page
Now you select a start page from which you can test and run your Web site
directly from PowerBuilder.
2 Click the Run/Debug tab and click the browse button (...) next to the
Start page textbox.
3 In the Target page of the Choose URL dialog box, select Login.htm and
click OK.
4 Click the Database tab in the Properties Target Customer dialog box.
250
Lesson 11 Creating Web pages
251
Deploy and run the Web site
4 Type Hello in the Name textbox and Good-bye in the Password textbox.
Click the Login button.
An error message displays since the username and password are not the
same.
252
Lesson 11 Creating Web pages
5 Click OK.
Type Hello in both the Name and Password textboxes.
Click the Login button.
Now the Welcome page displays.
In the next lesson, you add a Web DataWindow to the Product Information
page.
253
Deploy and run the Web site
254
LE S S O N 1 2 Using Web DataWindows
255
Before you begin this lesson
256
Lesson 12 Using Web DataWindows
Now you set up a connection profile to EAServer. This tutorial assumes that
you are using EAServer on your local machine.
257
Set up an EAServer connection profile
3 Click Add.
The Edit EAServer Profile dialog box opens.
258
Lesson 12 Using Web DataWindows
A Web DataWindow container gathers all the supporting files and properties
that your page needs into a single area installed on the server.
The Web DataWindow Container wizard creates a custom EAServer
component that implements the HTMLGenerator80 interface and packages all
the DataWindow objects together with database connection information.
In this lesson you build a Web DataWindow container using the Web
DataWindow Container wizard, and you deploy the component directly to the
server for use by your Web application.
259
Build a Web DataWindow Container
4 Click Next.
The Specify Project Object window displays. Here you create a name for
the project.
Accept the default project name.
260
Lesson 12 Using Web DataWindows
5 Click Next.
Select the EAS Demo DB V4 from the Database Profiles list.
6 Click Next until the final wizard page displays, accepting the defaults
as listed:
Wizard Options Default Value
Choose EAServer Profile local
Specify EAServer Container and pbtutor_component
Package Name pbtutor_package
Specify Instance Pooling Options Supported
Specify Other Component Options None
Specify Dynamic Library Options pbtutor.pbd
261
Build a Web DataWindow Container
7 Click Finish.
The p_pbtutor_webdw project displays in the Project painter.
262
Lesson 12 Using Web DataWindows
In this lesson you use the Web DataWindow Container you just created when
you create a new Web page, Addproduct.htm.
263
Create a Web page with a Web DataWindow Container
7 Click Next.
The Choose DataWindow Object page displays.
264
Lesson 12 Using Web DataWindows
8 Select d_product.
9 Click Next.
Click Finish to accept your selections.
The Addproduct.htm Web page displays in Page view.
265
Enable a new product information button
So far the addproduct.htm page contains a Web DataWindow. Now you add
text, link to the database, enable users to add product information to the
database, and link to the product.htm page where users can view the
information they have added.
2 Place the cursor to the left of the DataWindow (in the lower left corner)
and press ENTER.
Insert the following text in the paragraph above the Web DataWindow:
Click here to add new product information
Under this text you will add a new button which will display a blank row
in the DataWindow.
266
Lesson 12 Using Web DataWindows
5 Click OK.
Select cb_addproduct from the first dropdown listbox in the Script
editor.
or
Click the Add New Product Information button in page view to have the
Script editor display cb_addproduct in the first dropdown listbox.
When the end user clicks the Add New Product Information button on the
Web page, the Web DataWindow displays with empty textboxes for user
input.
7 Place the cursor after the paragraph icon at the right end of the Add
New Product button.
Press ENTER.
Type the following text on one line:
Add a new product. Enter information into all the
textboxes and click Update Database.
267
Enable a new product information button
12 Click OK.
Click the Save button in the PainterBar.
268
Lesson 12 Using Web DataWindows
After you add product information, you must update the database, so now you
add a button for updating the database. You also add a link to the product
information so that you can view it.
1 Place the cursor in the paragraph at the bottom right of the Web
DataWindow and press ENTER.
Select Insert>Form Field>Push Button from the menu bar.
The Button Properties page displays.
269
Add a button to update the database
3 Click OK.
Press ENTER.
Pressing the Update Database button from the Web page adds the
information entered by the end user to the database.
6 Place the cursor in the paragraph under the Update Database button
and select Format>Hyperlink.
270
Lesson 12 Using Web DataWindows
271
Add a DataWindow to an existing Web page
Now you add a DataWindow to an existing Web page. You clear the automatic
retrieval checkbox for this DataWindow. This prevents automatic insertion into
your page of the script that accesses the Web DataWindow.
You then link a specific DataWindow retrieval argument to a parameter on the
Web page and retrieve the DataWindow programmatically.
272
Lesson 12 Using Web DataWindows
4 Click the browse button (...) next to the DataWindow Library textbox.
Double-click tutor_pb.pbl.
Select the Generate Absolute Path in Script checkbox.
Select d_product from the DataWindow dropdown listbox.
Generate absolute path is used here for the purposes of the tutorial only. In
a production environment, you should use the actual file location.
273
Add a DataWindow to an existing Web page
Later you will write a script to retrieve product data using a button clicked
event.
7 Click OK.
Now you add a link from this page to the new product page.
11 Click OK twice.
274
Lesson 12 Using Web DataWindows
Now you add a retrieve function to the product.htm page. It will allow you to
request the product ID for any product in the database and display the product
information on the page.
3 Highlight the word Cell in the first column and type Display Product
Information by Product ID.
275
Add the ability to retrieve product information
5 Click OK.
Place the cursor after the table.
Press the ENTER key once to move to the next line.
Select Insert>Form Field>Push Button from the menu bar.
The Button Properties page displays.
7 Click OK.
Select cb_get in the first dropdown listbox of the Script editor.
Select ServerAction() from the center dropdown listbox.
276
Lesson 12 Using Web DataWindows
Before you test your Web application, it is useful to first test the
Addproduct.htm Web page to see if you can add a product. To do this, you
specify that the start page for the Customer target is Addproduct.htm, and then
you deploy and run the Customer target.
2 Click the Run/Debug tab and click the browse (...) button.
Click the Target tab in the Choose URL dialog box.
4 Check to see that your Personal Web Server and the local EAServer
are running.
277
Test the Web page
Next you add new product information using this Web page.
278
Lesson 12 Using Web DataWindows
Next you add new product information and update the database with the new
information.
279
Add a new product to the database
Textbox Value
Product ID 9999
Product Name Shirt
Product Description Denim shirt
Size Large
Color Blue (select from dropdown list)
Quantity 6
Unit Price 27.95
280
Lesson 12 Using Web DataWindows
You have completed the development of your Web application. Now you
change the start page back to the Login.htm page, the redeploy, run, and test the
Web application.
2 Click the Run/Debug tab and click the browse (...) button.
Click the Target tab in the Choose URL dialog box.
4 Check to see that your Personal Web Server and the local EAServer
are running.
281
Run the Web application
7 Type your first name in both the Name and Password textboxes.
Click the Login button.
The Welcome page displays.
282
Lesson 12 Using Web DataWindows
283
Run the Web application
Textbox Value
Product ID 4321
Product Name Tee Shirt
Product Description Cotton tee shirt
Size Small
Color White (select from dropdown list)
Quantity 100
Unit Price 15.95
284
Lesson 12 Using Web DataWindows
285
What to do next
What to do next
Congratulations. You have completed Part 3 of the tutorial. Now you know the
basics of working with Web targets in PowerBuilder.
Web target books to The Preface to this book includes a guide to the PowerBuilder documentation.
use next To further your education in Web targets and Web DataWindows, you should
continue with these books:
Working with Web Targets
Web Targets Reference
DataWindow Programmer’s Guide
DataWindow Reference
Installing the Online All the PowerBuilder books are available in the Online Books and on the
Books Sybase Web site at www.sybase.com.
For information on how to install the Online Books, see the Installation Guide.
Looking at the Web To see examples of PowerBuilder 8 code, including a Web target sample, you
target sample should look at the examples that are available on the Sybase Web site at
www.sybase.com/pb8examples.
286
Index
287
Index
288
Index
G M
GetActiveSheet function 155 machine code 210
global main window, size 41
functions 17 manager
structures 17 connection service 102
variables 107 MDI applications 20, 21
graphics 230 menu bars, description 16
menu items
adding scripts for 155
defining 144
H description 16
HALT statement 119 Menu painter, using 144
header band in DataWindow objects 162, 164 menus
Help about 16
context messages 82 adding scripts for 155
Microhelp 152 and toolbars 146, 153
creating 149
inheriting 149
menu items 144
I saving 150
icons, application 39 MicroHelp 152
Information
add 266
inheritance
and menus 149 O
and object-oriented programming 5 object orientation 5
and user objects 124 object-level
and windows 123 functions 17
initialization files structures 17
odbc.ini 92 Open event
pb.ini 98 frame window 86
pbtutor.ini 107 sheet window 138
InsertRow function 137 Output window 7
L P
libraries PainterBar
about 18 adding controls from 70
dynamic 210 popup menus 61
rebuild objects in 141 using 8
search path for application 126 painters 8
Parent (PowerScript pronoun) 112
Parent (pronoun) 113
PBL see PowerBuilder Library (PBL)
Pcode (pseudocode) 210
289
Index
290
Index
toolbars views
runtime application 153 docking 55
showing text 60 floating 55
Transaction object 105, 139 manipulating 52
tutorial pinning 54
files 24 saving layout schemes 57
initialization file 107 stacks 56
setup 24 visual user objects 18
U W
Update function 137 Web DataWindow 272
user events Web DataWindow Container 259
adding scripts for 134 Web page
defining 134 deploy 277
triggering from menu scripts 155 graphic 230
user objects with DataWindow 263
about 18 Web pages, introduction 221
using 124 Web targets, about 7
WHERE clause 174
Window painter, deleting a control 72
window size 41
V windows
validation 246 about 13
variables ancestor 123
global 107 CommandButton controls on 79
gnv_connect 108 creating 66
instance 107 DataWindow controls on 124
lm_menu 157 deleting a control 72
naming conventions 108 opening in a script 85
validation 246 Picture controls on 72
vertical scrollbars 130 previewing 83
view, types of response 66
Design (DataWindow painter) 162 saving 66
HTML Preview (DataWindow painter) 165 StaticText controls on 74
Layout 67 tab order in 81
Object Details (Database painter) 100 wizards
Object Layout (Database painter) 100 4GL 240
Objects (Database painter) 98 Connection Object 102
Preview (DataWindow painter) 165 DataWindow 162
Properties 67 Project 210
Script 82 Web page 227, 263
Syntax (Select painter) 172 workspaces 7
Table Layout (Select painter) 171
WYSIWYG (Menu painter) 144
291