Clarion ASP

CLARION/ASP CLARION/ASP Annotated Examples Annotated Examples
CLARION/ASP Annotated Examples
COPYRIGHT 1994-2003 SoftVelocity Incorporated. All rights reserved.

This publication is protected by copyright and all rights are reserved by SoftVelocity Incorporated. It may not, in whole or part, be copied, photocopied, reproduced, translated, or reduced to any electronic medium or machine-readable form without prior consent, in writing, from SoftVelocity Incorporated.
This publication supports Clarion. It is possible that it may contain technical or typographical errors. SoftVelocity Incorporated provides this publication as is, without warranty of any kind, either expressed or implied. Revision 1.3
SoftVelocity Incorporated 2769 East Atlantic Blvd. Pompano Beach, Florida 33062 (954) 785-4555 www.softvelocity.com
Trademark Acknowledgements: SoftVelocity is a trademark of SoftVelocity Incorporated. Clarion is a trademark of SoftVelocity Incorporated. Microsoft, Windows, and Visual Basic are registered trademarks of Microsoft Corporation. All other products and company names are trademarks of their respective owners.
Printed in the United States of America (0204)
Contents:
1. 2. Introduction Preliminary: Setup 7 9
SQL Server ......................................................................................................................... 9 The Dictionary Changes.................................................................................................... 10 The /images Virtual Directory............................................................................................ 11
3.
Simple One Table Application
13
Application Wizard ............................................................................................... 13 Applying the Global Extension ............................................................................. 14 Applying the Browse Extension ........................................................................... 19 Applying the Form Extension ............................................................................... 20 Generation and Setting Up IIS ............................................................................. 22 Testing the Application......................................................................................... 24
4.
The To Do List Application
29
Run the Application Wizard.................................................................................. 29 Set the Global Template Options......................................................................... 31 Set up the Style Sheet ......................................................................................... 33 Applying the Style Sheet to the Project................................................................ 38 Run the Connection Wizard ................................................................................. 39 Set Security Options ............................................................................................ 41 Finish the Global Options..................................................................................... 43 Applying the Browse Template ............................................................................ 44 Enable My Records Filtering................................................................................ 45 Specifying Columns for the Browse ..................................................................... 46 Customize Individual Fields ................................................................................. 47 Applying the Form Template................................................................................ 50 Enable My Records Filtering................................................................................ 50 Set Actions Options.............................................................................................. 52 Set Data Control Options ..................................................................................... 52 Generate the ASP Pages..................................................................................... 55 Setup the IIS Virtual Directory.............................................................................. 56 Running Your First Test ....................................................................................... 58 Examining the HTML Frames .............................................................................. 61 Help Pages........................................................................................................... 65
5.
Search Contacts Example
67
Run the Application Wizard.................................................................................. 68 Set the Global Template Options......................................................................... 69 Set up the Style Sheet ......................................................................................... 71 Applying the Style Sheet to the Project................................................................ 76 Run the Connection Wizard ................................................................................. 77
CLARION/ASP Annotated Examples The BrowseviewContacts Procedure................................................................................ 78 Turning Off the Update Link................................................................................. 86 The Orders Procedure ...................................................................................................... 87 The Browse on the ProductPhotos View .......................................................................... 93 The Update Procedures .................................................................................................... 96 The Update Customers Form .............................................................................. 96 The Update Orders Form ..................................................................................... 96 The Update Suppliers Form ................................................................................. 97 The Update Employees Form .............................................................................. 98 The Update viewProductPhotos Form ............................................................... 100 Generate the ASP Pages................................................................................... 102 The Frames ..................................................................................................................... 103 The Search Frame ............................................................................................. 103 Generate the Project .......................................................................................... 106 Examining the Frame Set................................................................................... 106 The Main Frame................................................................................................. 106 Setting Up the Virtual Directory in IIS ................................................................ 108 Running Your First Test ..................................................................................... 110 Testing the Search Frame ................................................................................. 111
6.
The Orders Example
113
Setup and Global Properties ........................................................................................... 113 General Tab.............................................................................................................. 114 Style Sheet......................................................................................................... 114 Design Time Template ....................................................................................... 119 List Defaults ....................................................................................................... 121 Security Tab ....................................................................................................... 121 Administration Tab ............................................................................................. 122 Prep the Procedures ....................................................................................................... 123 The Browse Procedures.................................................................................................. 124 Customize the BrowseProducts procedure:....................................................... 124 Browse Customers Procedure ........................................................................... 128 The Browse Employees Procedure ................................................................... 131 The Browse Orders Procedure .......................................................................... 135 The Browse View Order Details Extended Procedure....................................... 140 The Browse Categories Procedure.................................................................... 142 The Select Managers Procedure ....................................................................... 143 The Select Orders Procedure ............................................................................ 144 The Select Products Procedure ......................................................................... 144 The Update Procedures .................................................................................................. 146 The UpdateCategories Procedure ..................................................................... 146 The UpdateCustomers Procedure ..................................................................... 150 The UpdateEmployees Procedure..................................................................... 153 The UpdateOrders Procedure............................................................................ 156 The UpdateOrder_Details Procedure ................................................................ 160 The UpdateProducts Procedure ........................................................................ 162 The UpdateShippers Procedure ........................................................................ 166
The UpdateSuppliers Procedure........................................................................ 167 The ViewOrdersQuery Procedure...................................................................... 171 Range Limits and "Duplicate" Browses........................................................................... 176 The BrowseOrders Procedure ........................................................................... 176 The BrowseProducts Procedure ........................................................................ 177 The BrowseView_Order_Details_Extended Procedure..................................... 177 Copy the BrowseOrders Procedure ................................................................... 177 Copy the BrowseProducts Procedure................................................................ 178
7.
Customizing Generated Pages
180
Categories Form with Products Browse (Filtered) Beneath............................................ 180 ViewOrdersQuery Form with the view_Order_Details_Extended Browse...................... 184 Addendum: Priming a Listbox on Add............................................................................. 188 Introductory Page............................................................................................................ 189
8. 9.
Pubs Example ASP Code Walkthrough
190 192
Browse ............................................................................................................................ 192 Script Language and Notice............................................................................... 192 Include Files ....................................................................................................... 193 Global Overrides ................................................................................................ 193 Variable Declarations ......................................................................................... 194 Debug Information.............................................................................................. 195 Prepare RecordSet and Session Variables ....................................................... 196 Column Sorts ..................................................................................................... 197 The Base SELECT Statement .......................................................................... 200 Appending WHERE and ORDER BY Clauses .................................................. 200 Checking for Reset or Locate Flags................................................................... 200 Building the WHERE Clause.............................................................................. 201 Finishing the WHERE Clause ............................................................................ 201 Open the RecordSet .......................................................................................... 201 More Debug Information .................................................................................... 202 Finish Up and Output ......................................................................................... 202 Function: NoRecordsFound ............................................................................... 204 Function:MergeBrowseProductsListTemplate ................................................... 204 Function: buildColumnLabels............................................................................. 206 Function: buildDataRows ................................................................................... 212 Function: BuildFooter ......................................................................................... 216 Edit/Update Page ............................................................................................................ 218 Script Language and Notice............................................................................... 218 Include Files and Declarations........................................................................... 218 The MergeTemplate Function............................................................................ 219 Open the Record Set ......................................................................................... 220 Function: displayBadRecord .............................................................................. 220 MergeEditTemplate Function............................................................................. 221
CLARION/ASP Annotated Examples Get the Record................................................................................................... 221 Set the Form Action ........................................................................................... 222 Get the Field Values........................................................................................... 222 Display (or Not) the Delete Button ..................................................................... 223 Call the Merge Function and End ...................................................................... 224 The Edit Processor Page ................................................................................................ 225 Script Language and Notice............................................................................... 225 Include Files ....................................................................................................... 225 Variable Declarations and Open the Record Set............................................... 226 The MergeTemplate Function............................................................................ 227 Check for Not Found .......................................................................................... 227 Get the Record................................................................................................... 228 Placing the Fields............................................................................................... 229 Send the Data to the Merge............................................................................... 234
CLARION/ASP Introduction
1.
Introduction
This Annotated Examples manual consists of the following sections: Chapter 2, Part 1, SQL Server Setup walks you through attaching a slightly modified Northwind database to your DBMS. Note that the modifications consist of additional tables, views and triggers, and do not alter any of the existing Northwind data except in one case: the images in the Categories tables are stored in GIF format, not BMP, for browser compatibility. Any existing samples from other programs which you may have worked on or intend to work on should have no problem accessing the sample data. Chapter 2, Part 2, Dictionary Changes, walks you through editing the sample dictionary so that it reflects the connection to your server. This is an optional step, because Clarion/ASP does not retrieve its connection information from the dictionary. Chapter 2, Part 3, IIS /images virtual directory preps the virtual directory for commonly used images, namely, the Clarion/ASP button images. Chapter 3, the Single One Table App example shows you how to generate a bare minimum Clarion/ASP app. Because Clarion/ASP allows you to create a very rich interface, there are many design time options in the template. This could be overwhelming to a new developer. In this exercise, youll wizard up an app, apply the global extension template, declare the ADO connection, then apply the template to a browse and a form with no other options. The result will be a fully functional but plain looking ASP application. The entire process should only take a few minutes. Chapter 4, the To Do List Application example shows you a deceptively simple application with lots of functionality, and introduces the topic of site integration. It places the application inside an HTML frame (as opposed to standing alone), and demonstrates the use of HTML parameters to filter the data. Additionally, it demonstrates security and the use of My Records to limit the viewing and editing of data to the owner of that data. Chapter 5, the SearchContacts Application example introduces concepts such as using custom controls for links which dynamically call one procedure or another, or one filter or another based on record contents. It makes extensive use of graphics, both from database fields and external files. Finally, it illustrates the ability to edit the runtime HTML templates, which is something many web designers are likely to wish to do in order to fine tune the appearance of the application. Chapter 6, the Orders example shows you advanced concepts such as editing the generated ASP pages to actually change the functionality.
CLARION/ASP Annotated Examples Chapter 7, the final section provides an ASP code walkthrough, describing what each section of the ASP code (browse, form, login, and utility) actually do, and how they do it. Before you begin, there are two important prerequisites: IIS must be set up on your machine, as per the section in the Users Guide entitled Internet Information Server Setup. You should optionally (unless another developer in your shop has already done this) have the MS SQL Enterprise Manager client tools installed on your machine, along with rights to modify the Northwind sample database on your server (Youll be adding two tables using scripts provided with Clarion/ASP. An HTML editor is an optional third prerequisite, but highly recommended.
CLARION/ASP Preliminary: Setup
2.
Preliminary: Setup
Included in your installation, in the <clarion root>\examples\asp directory, youll find two modified Northwind demonstration databases: northwind.mdf, and northwind.ldf, contained in a file called northwind database.zip. Microsoft SQL Server 2000 allows you to copy a file to the database server and attach. This is much simpler than running scripts to build the modified database. MS SQL Server 7.0 allows something similar, though not quite as conveniently. The modifications in this database consist of additional tables, views and triggers, and do not alter any of the existing Northwind data except in one case: the images in the Categories tables are stored in GIF format instead of BMP, for browser compatibility. Any existing programs which you may have worked on or intend to work on should have no problem accessing the sample data. For SQL Server 2000 users, the process requires that you copy the attached files to a directory on the server (you may not attach over the network to a file on your local drive) to the directory in which you wish them permanently to reside. You must also have the MS SQL Server Enterprise Client tools on your desktop, if you wish to run the attach process from your desk. These instructions are for MS SQL Server 2000. Instructions for MS SQL Server 7.0 are included in the section Applying the Global Extension, which is at the beginning of the exercise. (Youll be using the OLE DB Provider to attach, because the 7.0 Enterprise Manager client does not support attaching a database. Please unzip the files in the northwind database.zip to the server. Once the file is copied to the server, do the following: 1. 2. 3. Open the MS SQL Server client software. (The MS SQL Server snap in for the Microsoft Management Console). Double click the correct SQL Server in the left pane of the Enterprise Manager client so that you see the Databases folder, and the databases below it. Right click the Northwind database icon, and choose All Tasks > Rename Database. Type in a new name such as Northwind2. Note: you may have to stop the northwind database first. After renaming the old one, right click the Databases folder, and choose All Tasks > Attach Database...
SQL Server
4.
10 5.
CLARION/ASP Annotated Examples In the Attach Database dialog, type in the fully qualified file name (as seen by the server) for the northwind.mdf file you copied to the server (previously expanded from the zip file, and copied along with the LDF file). Be sure, also, that the User ID and password that you type in this dialog (as opposed to the runtime user, which you typed in the previous box) has administrator privilege on the SQL Server. Please note also that importing the .MDF and .LDF files does not permit us to import user accounts! Be sure that your runtime user account is set up on the machine! Depending on the SQL Server setup, you may also have to grant access to the public group for the attached database! Type in Northwind in the Attach As box. Choose a database owner from the dropdown list. In default installations, this should probably be the sa SQL administrator account. Exit MMC when done.
6. 7. 8.
The Dictionary Changes

Though this is an optional step, we highly recommend it. By storing this in the dictionary, you can browse the tables using the dictionary editor, or generate a desktop application to enter some data while constructing your ASP application. To substitute your server information: 1. 2. With the Clarion development environment open, choose File > Open. In the Open File dialog, choose Files of Type Dictionary (*.DCT), and open examples\asp\northwind.dct.
For each table listed in the left pane of the Dictionary Editor which then opens: 3. Right-click and choose Properties. This opens the Edit Table Properties dialog.
CLARION/ASP Preliminary: Setup 4. In the Owner field, the three parameters are server name, database name, and user name. Change the server and user names to those applicable to your server, and press OK to close the Edit Table Properties dialog.
11
5.
Save and close the Dictionary Editor when all tables are modified.
The /images Virtual Directory

Many sites store images to be used throughout the site in a single directory off the root, usually called /images. This saves disk space because the image files need not be repeated throughout. The Clarion/ASP button images are a good candidate for storing in a central location because they are repeated from application to application. The install program copies the images to a default directory called \CLARION6\images\asp. (The default directory structure referred to is "Clarion6" throughout this document. If you are using Clarion Version 5.5, please substitute the appropriate path). This section instructs you to create a virtual directory called images, pointing to that directory. If you already have a /images virtual directory on your localhost site, you may simply copy the images to it and skip over the following instructions: 1. Open up whichever of the IIS administrative tools is applicable to your operating system. (Windows NT: Start > Programs > Administrative Tools > Internet Services Manager; Windows 2000/XP: Start > Settings > Control Panel > Administrative Tools > Internet Information Services). In the left hand pane, locate an icon called default web site and expand it (the node order should be something like: Internet Information Services > your computer name > Web Sites > Default Web Site).
2.
12 3.
CLARION/ASP Annotated Examples Right-click the default web site and choose New > Virtual Directory.
4. 5.
Press the Next button, and when prompted, name for the virtual directory images. Press the Next button, and when prompted, navigate to your the \CLARION6\images\asp directory by pressing the Browse button. (or to whatever the relative path should be if you installed Clarion to a directory other than \CLARION6.
The Clarion/ASP install provides for a default set of blue buttons (enabled), all 20 pixels by 20 pixels. Disabled state is grayscale images (of the same buttons). Below the images directory, you'll find alternate button sets in green and brown. Since the blue buttons are repeated in a subdirectory, should you wish to experiment, you can simply copy over one set of buttons with another.
CLARION/ASP Simple One Table Application
13
3.
Simple One Table Application

In this section youll generate an application and apply the minimum changes necessary to implement a Clarion/ASP application. This assumes that your Internet Information Server installation is set up properly, as described in the Users Guide.
Application Wizard
Close any projects open in the Clarion development environment before beginning. 1. 2. From the Clarion development environment, choose File > New > Application. For the purposes of this exercise, we will assume that you have installed Clarion to the default location, CLARION6. In the Open File dialog which opened upon the previous command, navigate to the CLARION6\examples\asp directory. Press the New Folder button in the Open File dialog. Name the directory MyASP and double click it to open it. Once in the directory, type MyASP in the file name box, thus creating a new .app file called CLARION6\examples\asp\MyASP\MyASP.app. In the Application Properties dialog which appears, press the ellipsis button next to the dictionary field, navigate one directory above, and choose northwind.dct for the dictionary.
3.
4. 5. 6.
Be sure that the Application Wizard box is checked before pressing the OK button to close the dialog. This launches the Application Wizard. Choose the ABC Class application wizard in the first window; note that Clarion/ASP may be applied to both ABC and Clarion template set applications. Press the Next button when the first, introductory panel of the wizard appears.
14 7. 8.
CLARION/ASP Annotated Examples Uncheck the Generate Procedures for All Files in my Dictionary box on the next panel and press Next. Select Products from the tables list in the next pane, and press Next.
9.
Click Next to pass the next panel (or two if using Enterprise). When you arrive at the panel with the Generate Reports for Each File box, uncheck that box and press Next until finished with the wizard.
Applying the Global Extension

You should now have a small application tree and are ready to apply the ASP template. Youll start with the global template extension: 1. 2. 3. 4. From the development environment menu, choose Application > Global Properties. In the Global Properties dialog, press the Insert button. In the Extension and Control Templates dialog, press the Insert button. Choose the ASP Global Extension Template (class SVASP) in the Select Extension dialog and press the Select button.
15
Youve now populated the global extension. There is only one required piece of information: the connection information that will allow us to tell ADO how to access the database: 1. 2. While still in the Extension and Control Templates dialog, with the ASP global extension selected, select the Database tab on the right side of the dialog. Press the Connection Properties button on this tab. The Connection Properties dialog appears.
16
3.
Press the Connection Builder button.
The Data Link Properties dialog now appears. If ADO and MDAC were not installed with the operating system, they can be installed by Microsoft Office or with the MS SQL Server Enterprise Manager software. Fill in the properties as follows: 1. 2. 3. 4. Select the Provider tab, if the dialog did not automatically open to it, and choose Microsoft OLE DB Provider for SQL Server, then press the Next button. On the Connection tab, enter the server name, or choose it from the drop list in item number 1. Enter the user name and password for the database in item number 2. Check the Allow Saving Password box, in number 2. You must not skip this step, else Internet Information Server has no way to log into the database.
17
5. 5a.
Type northwind in the Select the database on the server box. Be sure to test the connection by pressing the Test Connection button. For MS SQL Server 6.5 users only: this is the point at which you attach the database. Select the Attach a database file as database name radio button, and type northwind2 in the box below the radio button. Do not press the File Lookup button next to the using the filename box. Instead, you must type in the fully qualified path on the server, not your local machine, for the northwind.mdf file, which you must copy there. You must also copy the northwind.ldf file. Be sure, also, that the User ID and password that you type in this dialog (as opposed to the runtime user, which you typed in the previous box) has administrator privilege on the SQL Server. Please note also that importing the .MDF and .LDF files does not permit us to import user accounts! Be sure that your runtime user account is set up on the machine! Depending on the SQL Server setup, you may also have to grant access to the public group for the attached database! SQL Server 7.0 developers, please remember that if this manual refers to the northwind database in any exercise, it will actually be the northwind2 database for you.
5b.
18 6. 7.
CLARION/ASP Annotated Examples Press the Test Connection button, and verify that you receive a success message. If not, review the settings in this dialog. Press the OK button to close the Data Link Properties dialog.
You should have now returned to the Connection Properties dialog, and a connection string something like the one below should appear at the bottom of this dialog:
Provider=SQLOLEDB.1;Password=YourPassword;Persist Security Info=True;User ID=YourUsername;Data Source=YourDataServer
You may now close the global extension dialog: 1. 2. 3. Press the OK button to close the Connection Properties dialog. Press the OK button to close the Extension and Control Templates dialog. Press the OK button to close the Global Properties dialog.
You should now have only the Application Tree dialog open. You are now ready to apply the Browse extension.
19
Applying the Browse Extension

You may now apply the Browse extension to the browse on the Products table: 1. 2. 3. Right click on the BrowseProducts procedure in the Application Tree dialog and choose Extensions from the popup menu. Press Insert when the Extension and Control Templates dialog appears. Choose ASP Browse from the Select Extension dialog and press the Select button.
4.
There are no further required items; therefore press OK to close the Extension and Control Templates dialog.
20
Applying the Form Extension

You may now apply the From extension to the update procedure for the Products table: 1. 2. 3. Right click on the UpdateProducts procedure in the Application Tree dialog and choose Extensions from the popup menu. Press Insert when the Extension and Control Templates dialog appears. Choose ASP Form from the Select Extension dialog and press the Select button.
The Clarion/ASP templates will attempt to create a link to a select browse procedure for the Supplier and Category fields in this table, so that an end user could press a lookup button and choose from a popup window list of suppliers or categories. Well actually disable that in this example, to keep the final applications as small and simple as possible. 4. 5. 6. 7. 8. Click the Controls tab in the ASP prompts. Select the SupplierID field and press Properties. Select the Validation tab in the Controls dialog. Change the Client Side Validation dropdown list from Must be in File to No Validation and press OK. Select the CategoryID field and press Properties.
CLARION/ASP Simple One Table Application 9. 10. 11. Select the Validation tab in the Controls dialog. Change the Client Side Validation dropdown list from Must be in File to No Validation and press OK. There are no further required items; therefore press OK twice to close the Extension and Control Templates dialog.
21
22
Because MS SQL Server has a constraint on the SupplierID and CategoryID columns, the data integrity will be maintained; all we did was take off the client side check, and the server therefore would generate a message should someone try to enter an illegal value.
Generation and Setting Up IIS

Youve now applied all the necessary parts for a minimal ASP application. The template has already created a link between the browse and the form. Youre now ready to generate and test. 1. From the development environment menu, choose Project > Generate All. This creates the necessary subdirectories, generates the ASP, HTM, and CSS (cascading style sheets) files necessary for the product, and copies images as necessary.
The output is placed in the project\asp directory, as well as directories beneath it called HTML, images, and styles. Before you may test, however, you must tell Internet Information Server where the application is: 1. From the Windows Start menu, choose Start > Programs > Administrative Tools > Internet Information Services (the exact name and location of the IIS configuration manager may vary slightly from version to version of Windows.
CLARION/ASP Simple One Table Application 2. 3. 4. 5.
23
Open each successive node in the tree pane at the left of the Internet Information Services manager until you can see the Default Web Site node. Right click on the Default Web Site node and from the popup menu, choose New > Virtual Directory. Press Next to skip past the introductory pane of the Virtual Directory Wizard. On the second pane, enter MyASP in the Alias box. This will serve as the name for the virtual directory. Press Next.
6.
Press the Browse button next to the Directory box on the next panel. Browse to the applications directory, then locate the asp directory beneath it and select the asp directory. If youve installed to the default Clarion directory and followed our suggestion for the application directory name above, that directory should be \CLARION6\examples\asp\myasp\asp.
24
7.
Press the Next button twice, and the Finish button, accepting the defaults.
Testing the Application

Clarion/ASP generates a debug/test page to insure that the database access has been properly defined. You may access this page through another page it automatically generates, the index page. The index page is meant to serve as a temporary table of contents so that the developer can test the individual procedure pages before incorporating them into a site. Note that it is very important that you do not copy the debug/test page to a server visible on the Internet, as it will display your database server name, user ID, and password. To test the application, load the index page, view the query/test page, then load the browse and form procedures: 1. Open your browser, type http://localhost/myasp/index.htm in the address box, and press enter. This should display the index page. At the top is a link to the test page, then browses (HTML tables), then forms (HTML forms).
25
2.
Click on the MyASPTest.asp link to test the queries. If successful, the last item in the results page will be the FileSystem system, and it will display a success message.
3.
Press the Back button in your browser to return to the index page.
26
CLARION/ASP Annotated Examples 4. Locate the link to BrowseProductsList.asp and click on it. A browse table page should appear. Page through the table using the navigation button bar at the bottom to test your access.
5.
A pencil graphic should appear in the right hand column of the browse list. Click on any one of the graphics. An update form (view only) should appear.
CLARION/ASP Simple One Table Application 6. At the bottom of the update form another pencil graphic should appear. Click on it. An editable update form should appear.
27
7.
Change one of the less important column values (such as Units on Order) and press the Submit button. An Update Succeeded message should appear. Note: you will see ellipsis buttons next to the CategoryID and SupplierID fields. Dont bother pressing them; youve disabled the logic and havent applied the ASP extension to the select browses. That will be for a later lesson!
28 8.
CLARION/ASP Annotated Examples Press the back button, so that you return to an edit form, and press the help button. A popup window should appear with text at the bottom instructing that you should have customized your help text.
You may now close your browser or return to your home page. Youve successfully created and tested a simple Clarion/ASP application. You may now continue on to work with the example applications.
CLARION/ASP The To Do List Application
29
4.
The To Do List Application

This exercise walks you through setting up and running the todo list example application. More than the traditional desktop to do application, this example aims to be attractive, intelligent, and functional. Note: If youre not reading/doing the examples in this book in order, some of these steps may seem repetitious, since youre setting up access to the same database, and a similar style sheet (but using different colors). This application uses Clarion/ASPs My Records feature, which filters all recordsets so that one field must always match the users ID. That, in combination with the use of where clauses from links in the frame allows for flexible functionality with the use of only two procedures. Note that though this exercise will create the Clarion/ASP application from scratch, the HTML frames are provided in finished state. The sample application will be installed to beneath your Clarion directory, in examples\asp\todo. In addition to the sample file, several images and an html design time template are located in the examples\asp\todo\asp directory and subdirectories, and the dictionary resides in examples\asp\. Follow these steps to create the application. Note that weve also provided an application called todo.app.done should you wish to update your dictionary and simply rename that rather than follow the steps to create your own. There are many, many steps in this exercise, most of them concerned with setting up a style sheet. This exercise could easy take over an hour. Weve found that with familiarity, and once you have IIS, the DSN, and a preferred style sheet set up, its possible to take a generated application and apply Clarion/ASP to it in under a minute.
Run the Application Wizard

For the sample todo app, youll require only two tables: a security table, and the todo items table. Start in the Clarion development environment, without opening a dictionary or application. 1. 2. Choose File > New > Application. In the Open File dialog, navigate to the examples\asp\todo directory, name the application Todo.app, and press Save.
Weve included a finished example called complete.app. Feel free to examine this.
30
CLARION/ASP Annotated Examples Important: you cannot generate and run the complete example as is, because you must first edit the connection string to reference your DBMS server. 3. In the Application Properties dialog, select the northwind dictionary (in the directory above), check the Application Wizard checkbox and press OK.
4. 5. 6. 7.
In the Select an Application Wizard dialog, select ApplicationWizard and press Select. Click Next when you see the introductory panel of the Application Wizard. Be sure the Generate Procedures for all Files checkbox is unchecked in the next panel of the wizard. Select aspusers and ToDoList in the next panel, labeled Select files to Use, then press Next.
8.
Press Next on both of the next two panels, then be sure that Generate Reports for All Files is unchecked on the following panel, labeled Finally... Press Finish.
31
The application appears as a default application containing six procedures.
Set the Global Template Options

This section walks you through setting the global options. It will include walking you through creating a style sheet. Creating a style sheet makes this a somewhat lengthy process, but one that you probably wont do for every project (more likely, youll reuse a style sheet created previously, or slightly modify one). Begin with your application tree open to the application created in the previous section. To apply the Global template:
32 1. 2. 3. 4.
CLARION/ASP Annotated Examples Press the Global button on the Application Tree toolbar. Press the Extensions button in the Global Properties dialog. Press the Insert button in the Extensions and Control Templates dialog. Locate the ASP Global Template Extension in the Select Template extension dialog. Select it and press Select.
The design time template interface for the Clarion/ASP global template appears in the right hand side of the Extension and Control Templates dialog. The first tab of the ASP template interface is labeled Global: 1. Accept the language and help defaults at the top of the tab.
2. 3.
Skip over the Style Sheet group box; youll find directions for this in the next section. In the HTML Design time templates group box, press the Default Templates button. A default template dialog appears with four edit boxes. The default template provides the setting for the Clarion/ASP browse tables and forms; in essence the background, top, and bottom for the pages. Weve placed an HTML design time template in the examples\todo\html directory called todolist.htm.
CLARION/ASP The To Do List Application Type this file name (just the file, not the path) into each of the four boxes in this dialog, and press OK.
33
4. 5.
Accept the defaults for both List and Form defaults. In the Cascading Style Sheets group box, press the Style Sheet Editor button. The next section details the steps necessary for the styles.
Set up the Style Sheet

Starting with the Style Sheet Editor dialog, opened in the last section: 1. 2. Press the Insert button to declare a new style. the Style Sheet dialog appears. Type in MyStyles in the file name box at the top.
34 3. 4. 5.
CLARION/ASP Annotated Examples Accept the defaults for the hyperlinks styles, and click on the Body Tag tab. Set the body width by typing 99% in the width box. Set no body color (i.e., it will pick it up from the design time template) by typing COLOR:NONE in the background color box. In the steps below, we will set distinctive colors for the components that Clarion/ASP places in the pages it generates. For those developers used to Red-Green-Blue values for desktop applications, youll soon see that HTML specifies the use of hexadecimal values for colors; therefore the template translates from decimal to hexadecimal, and youll see the hexadecimal values.
6. 7.
Click on the Background Class tab. Set the body width to 98% by typing it in the width box Set the background color to COLOR:NONE by typing it in the background color box. The background class differs from the body in that this choice is for the inside of the forms that Clarion/ASP places on the background of the page, and the body is for the entire page.
CLARION/ASP The To Do List Application 8. Click on the Data tab and repeat: set the body width to 98% by typing it in the width box, and the background color to COLOR:NONE. Now we can customize the individual parts, all of which are accessed through this tab. Press the Borders button. Four group boxes, for the top, bottom, left and right border lines each contain three options for the line style, width and color.
35
9. 10. 11. 12. 13. 14.
Set the Line Width for all four sides to thin. Note that youre provided either with specific pixel width choices or relative choices. Set the Line Style for all four sides to solid. Press OK to close the Borders dialog. Back in the Style Sheet dialog, press the Padding button. This controls the fill space around the data grid cells. Set the padding to 2 pixels for all sides. Back in the Style Sheet dialog, in the sub classes group, press the Header button. This controls the appearance of the text at the very top of browses and forms, in effect, the caption area. Press the ellipsis button next to the background color. In the Color Picker dialog, press Define Custom Colors, click on a blank custom color box, and then in the right side of the dialog, enter 241, 242, and 212 respectively for the red, green, and blue values. The sample box should show a sandy color. Press the Add to Custom Colors button, then press OK. The value 0D4F2F1H should appear in the Background Color box. Back in the header dialog, set the text alignment to left.
15.
16.
36 17.
CLARION/ASP Annotated Examples Press the font button. In the font dialog, press the ellipsis next to the color. Click on a blank custom color box; either below or to the right of the first custom color box that you filled two steps ago. Define a new custom color with the RGB values of 0, 0, and 32. The color should be a very, very dark blue. Select Add to Custom Colors and press OK. The value 0200000H should appear in the background color box. Press OK to close the font dialog.
18. 19.
Back in the Style Sheet dialog, press the Column Label button. In the Column Label dialog, press the ellipsis (...) button next to background color. Click on a blank custom color box. Define a new custom color with the values of 133, 153, and 82. The color is a medium green. The value 0529985H should appear in the background color box. Press OK to close the dialog. Back in the Column Label dialog, set the text alignment to Left. Press the Data Rows button. Well declare two classes for data row appearance. First, however, set the grid spacing thickness to 1. Press the Insert button and type MyDataRow in the class name box in the Data Rows dialog.
20. 21. 22.
CLARION/ASP The To Do List Application 23. In the same dialog, press the ellipsis (...) button next to background color. The very first custom color should be the first sandy color you created. (If youve closed the session and restarted, you may open the Color Picker dialog, press Define Custom Colors, click on a blank custom color box, and then in the right side of the dialog, enter 241, 242, and 212 respectively for the red, green, and blue values. The sample box should show a sandy color. Press the Add to Custom Colors button, then press OK. The value 0D4F2F1H should appear in the Background Color box). Select that box and press OK. Back in the Data Rows dialog, press Insert to create another class for data row, and type AlternateRow in the class name box.
37
24.
25.
In the same dialog, press the ellipsis (...) button next to background color. Open the Color Picker dialog, press Define Custom Colors, click on a blank custom color box, and then in the right side of the dialog, enter 199, 208, and 168 respectively for the red, green, and blue values. The sample box should show a somewhat lighter green color than the one you defined previously. Press the Add to Custom Colors button, then press OK. The value 0A8D0C7H should appear in the Background Color box. Press OK to close the Data Rows dialog. Note: we will not actually implement a greenbar effect in this example. But you may do so for extra credit later, if you like. You might also experiment with conditional style formatting; for example, applying the alternate style to high priority tasks.
38 26. 27.
CLARION/ASP Annotated Examples Back in the Style Sheet dialog, press the Footer button, and then the ellipsis button next to background color in the next dialog. In the color picker dialog, locate the color you defined for the header, the sandy color. Select that box and press OK. The value 0D4F2F1H should appear in the background color box. Back in the Footer dialog, set text alignment to left, then press OK to close the Footer dialog. Press the Input Label button, press the ellipsis (...) button next to background color, and locate the color you chose for the column labels (the darker green color). Select that box and press OK. The value 0529985H should appear in the background color box. Press OK to close the Input Label dialog. Back in the Style Sheet dialog, press the Input button. In the Input dialog, press the ellipsis (...) button next to the background color. Locate the light sandy color. Select that box and press OK. The value 0D4F2F1H should appear in the background color box. Press OK to close the Input dialog. Press OK to close the Style Sheet dialog. Press Ok to close the Style Sheet Editor dialog.
28. 29.
30. 31.
32. 33.
Applying the Style Sheet to the Project

Simply defining the Style Sheet does not apply it to the project. If you were to generate the project now, the ASP pages would not include the HTML tag which merges in the style sheet formatting options. Note that there are four choices. This allows you to define the look of your browse tables, forms, and help popups separately. Note also the additional option for Global Cascading. Because style sheets are merged, you can create a hierarchy of styles, defining some formatting options as a global choice, but then adding additional options separately in style sheets for the forms and browses. Once youve returned to the Global Extensions and Control Templates: 1. Press the Style Sheets button.
CLARION/ASP The To Do List Application 2. Select the MyStyles style sheet you created in the previous section for each of the four cascading style sheet options.
39
3.
Press OK to return to the Global template options.
Run the Connection Wizard

1. While still in the Extension and Control Templates dialog, with the ASP global extension selected, select the Database tab on the right side of the dialog. 2. Press the Connection Properties button on this tab. The Connection Properties dialog appears.
3.
Press the Connection Builder button.
40
CLARION/ASP Annotated Examples The Data Link Properties dialog now appears. If ADO and MDAC were not installed with the operating system, they can be installed by Microsoft Office or with the MS SQL Server Enterprise Manager software. Fill in the properties as follows: 1. 2. 3. 4. Select the Provider tab, if the dialog did not automatically open to it, and choose Microsoft OLE DB Provider for SQL Server, then press the Next button. On the Connection tab, enter the server name, or choose it from the drop list in item number 1. Enter the user name and password for the database in item number 2. Check the Allow Saving Password box, in number 2. You must not skip this step, else Internet Information Server has no way to log into the database.
5.
Type northwind (or northwind2 if you followed the attach steps for MS SQL Server 7) in the Select the database on the server box. Be sure to test the connection by pressing the Test Connection button. Press the OK button to close the Data Link Properties dialog.
6.
CLARION/ASP The To Do List Application You should have now returned to the Connection Properties dialog, and a connection string something like the one below should appear at the bottom of this dialog:
41
You may now press the OK button to close the Connection Properties dialog.
Set Security Options

Click the Security tab within the Clarion/ASP global options. This step will allow you to identify where the list of users and passwords will be stored. The Northwind database you previously attached contained a table called ASPUsers. Its structure is as follows:
CREATE TABLE [dbo].[aspusers] ( [ID] [int] IDENTITY (1001, 1) NOT NULL , [First_Name] [nchar] (32) NULL , [Last_Name] [nchar] (40) NOT NULL , [AccessLevel] [tinyint] NOT NULL , [Email] [nchar] (128) NOT NULL , [Password] [nchar] (14) NOT NULL )
For those developers not conversant with MS SQL Servers flavor of SQL: the NCHAR type provides fixed length Unicode support, and IDENTITY is an auto increment type. In this case, the parameters (1001, 1) mean start counting at 1001, and increment by 1 for each new insert. Your application will use this table to check user security. Be sure (when youre ready to test) that youve entered at least one record in this table, and that you remember the user ID (email in this case) and password youve entered! 1. 2. Check the Provide User Based Security box. Press the ellipsis (...) button for the User Table, and select the aspusers table.
42
3.
Press the ellipsis (...) button for the Unique ID column and select ID. (this is different than the user ID; this is for internal use so that the Clarion/ASP code can uniquely identify a row). Press the ellipsis (...) button for the login name column and select Email. This will be the data that the end user must type in at the user prompt. Press the ellipsis (...) button for the user password column and select Password. Press the ellipsis (...) button for the user security level column and select AccessLevel. See the section in the Clarion/ASP manual entitled Global Options/Security Tab for a detailed description of how the security access levels work. Press the ellipsis (...) button for the user email column and select Email. This is in case your application must use a different user ID than email. Press the ellipsis (...) button for the user name column and select First_Name.
4. 5. 6.
7. 8.
CLARION/ASP The To Do List Application 9. Press the ellipsis (...) button for the user second name column and select Last_Name.
43
Later during this exercise youll be implementing My Records security which will limit access to individual records to the owner of each record. This will be done at the procedural level, but overall security must first be implemented at the global level.
Finish the Global Options

Click on the Administration tab of the Global Options (you may need to scroll the tabs to the right). You should always fill in the Administrator Email for all projects. Clarion/ASP automatically sends an email message to the administrator in case of database access failure. For this particular exercise, feel free to type in a bogus address, such as noone@nowhere.com in the Administrator Email box.
When ready, press OK twice to close the Global options dialog.
44
Applying the Browse Template

Youll now apply Clarion/ASP to the browse on the ToDoList table. You should see a procedure called BrowseToDoList in your application tree. 1. 2. 3. Right click the procedure and choose Extensions to open the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPBrowse from the Select Extension dialog and press Select.
The Clarion/ASP browse extension template is now applied, and may now be customized.
45
Enable My Records Filtering

First, youll set up application so that each record has an owner. When end users run the application, they will view and edit only those task records that belong to them. These will be identified by the end users email address. Set these options on the Globals tab of the Clarion/ASP browse extension template. 1. 2. 3. Check the Override box. Select the Security sub tab. Verify the Enable Security for this Procedure box is checked (this tab also allows you to specify that a particular procedure within an otherwise secure application should not receive security). Check the Enable My Records Filtering box. Press the ellipsis button (...) next to the Data Column to Test box, and select UserName.
4. 5.
6.
Verify that the dropdown list selection for Compare to Session, shows UserEmail.
46
CLARION/ASP Annotated Examples With these steps youve specified that each browse contain a clause limiting the query to those rows in which the value in the UserName column equals the users email address. No one, therefore, can view another users records.
Specifying Columns for the Browse

Because there will be a limited amount of space within the table displaying the browse data, and because unlike desktop applications there can be no horizontal scroll bar, youll delete some fields from the browse (though youll later keep all fields for the form). Click on the Data Columns tab. This displays the fields within the browse, which it gathers from the fields within the list box that the application wizard creates. Use the delete button to delete extra fields, and the up/down arrow buttons to rearrange the order so that the end result are the following fields, in this order: Subject DueDate Status Priority StartDate PerCentcomplete Reminder RemindDate IDNumber
47
Customize Individual Fields

In this part youll apply formatting to some of the fields in the field list, plus specify a link from the browse to a form. 1. 2. 3. Select the Subject field and press the Properties button. Select the Appearance tab in the Data Columns dialog. Specify 35% (dont forget the % character) in the width box. This specifies that the column should receive a minimum of 35% of the width of the table.
4. 5. 6.
Press the OK button to close the Data Columns dialog. Select the PercentComplete field and press the Properties button. Click the Column Sorting tab in the Data Columns dialog.
48 7.
CLARION/ASP Annotated Examples Specify that the Column Header Text says Completed, which is a little shorter and more readable than PerCentComplete. Note that we could have specified this in the data dictionary. We purposely neglected to do so in order to illustrate that you may customize the header text in this dialog.
8. 9. 10.
Press the OK button to close the Data Columns dialog. Select the IDNumber field and press the Properties button. On the General tab in the Data Columns dialog, check the Include in SQL Select but do not Display box. Note that the additional tabs for formatting disappear when the box is checked. We wish to include this column in the Select statement, because we pass its value to the update procedure (in steps four through eight), but theres no need for the end user to see a task ID number.
49
11.
Press OK twice to close the Data Columns and Extensions dialog and return to the Application Tree. Youve now configured the browse.
50
Applying the Form Template

Youll now apply Clarion/ASP to the update form for the ToDoList table. You should see a procedure called UpdateToDoList in your application tree. Applying the extension once provides for setting options for four separate ASP procedures, namely add, edit, delete and query by form. 1. 2. 3. Right click the procedure and choose Extensions to open the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPForm from the Select Extension dialog and press Select.
The Clarion/ASP form extension template is now applied, and may now be customized.
Enable My Records Filtering

First, youll set up the form so that each record has an owner. When end users run the application, they will view, edit or delete only those task records which belong to them. These will be identifed by the end users email address. Set these options on the Globals tab of the Clarion/ASP form extension template.
CLARION/ASP The To Do List Application 1. 2. 3. 4. 5. 6. Select the Override check box at the top of the Globals tab. Select the Security sub tab on the Globals tab. Check the Enable security for this procedure box. Check the Enable My Records Filtering box. Press the ellipsis button (...) next to the Data Column to Test box, and select UserName. From the dropdown list for Compare to Session, select UserEmail.
51
With these steps youve specified that no one can edit another users records. Should an end user attempt to manually link to someone elses data (for example, by entering a URL such as /UpdateProcedureEdit.asp?ID1=###), an error message will display. Note that you may also specify titles for the pages which will be generated for adds, changes and deletes. These titles appear within what the equivalent of the caption area will be. These override the global options. 1. 2. 3. Still on the Globals tab, choose the Titles sub tab. Change the Insert title from Insert Record to Insert Task. Optionally change the Edit, Delete, View and Search titles similarly.
52
Set Actions Options

Select the Actions tab to specify that a query by form be generated, as well as identifying the parent browse (cannot always be done automatically) and specifying titles for the page. 1. 2. Check the Generate QBF box. Select BrowseToDoList as the parent browse procedure from the dropdown list if its not already selected. Verifying the parent browse is simply an exercise in forming a good habit. We expect that many Clarion programmers will be applying the Clarion/ASP templates to procedures with many browses, and if there are enough, it may be difficult for the form template to identify the proper parent procedure.
Set Data Control Options

In setting the control options, youll specify that any unnecessary controls are removed from the query by form (focusing the end user upon a smaller number of fields, all of which are indexed), setting an appearance option on three fields, and reordering the controls. 1. The fields list should be in the order as follows, based upon their order in the update form, which in turn was based upon the order specified in the data dictionary: Subject DueDate Status Priority IDNumber StartDate PerCentComplete Reminder RemindDate UserName Notes DateCompleted DateCreated DateModified
53
Note that unlike the browse, there are no up/down, insert and delete buttons on the controls tab for the form. This is because the form extension template reads the window structure, and assumes that you wish to place exactly those controls in that order. Should you not be happy with the order, you must edit the window structure as text (using the ellipsis button next to the Window button on the Procedure Properties dialog). Cut and paste the controls and prompts so that they appear in the order you wish. Long range, should you wish to be able to generate other applications that display the fields in a consistent order, you must modify the dictionaries so that the fields lists within the table you wish to place in order reflect the order you wish, bearing in mind that you may have set the populate first and populate last options. Unlike an ISAM database, you do not need to worry about field order in the SQL Clarion FILE definition. To continue with selecting options for the fields in this table: 1. 2. 3. Select the DueDate field and press the Properties button. Check the Omit from QBF page box and press OK. Select the PerCentComplete field and press the Properties button. Check the Omit from QBF page box and press OK. Select the StartDate field and press the Properties button. Check the Omit from QBF page box and press OK.
54
4. 5. 6. 7.
Select the Reminder field and press the Properties button. Check the Omit from QBF page box and press OK. Select the RemindDate field and press the Properties button. Check the Omit from QBF page box and press OK. Select the DateCompleted field and press the Properties button. Check the Omit from QBF page box and press OK. Select the UserName field and press the Properties button. Check the Omit from QBF page box. Also, check the Read Only box. This will inhibit users from possibly editing the ID of another user. Note that this field will be invisible on an update/add form. Press OK. Select the IDNumber field and press the Properties button. Check the Omit from QBF page box. Also, check the Read Only box. Note that this field will not be present on the update/view only form, anyway, because weve selected My Records filtering, which automatically hides the filter field from the end user. Press OK. Press OK to close the Extension and Control Templates dialog.
8.
9.
55
Generate the ASP Pages

Congratulations! Youve finished setting up your Clarion/ASP application and are ready to generate and test on your local machine. The generation process is no different than normal Clarion source code generation. The only difference is that in addition to the Clarion source code modules, the application generator also produces .asp pages, as well as htm files. To generate your project, with only the Application Tree window open, choose Project > Generate All from the development environment menu.
56
Setup the IIS Virtual Directory

This section adds a virtual directory for the projects asp subdirectory so that you may easily run the Clarion/ASP on your local web server. 1. Open the Internet Services Manager via whatever the proper shortcut is in your version of Windows. In Windows 2000, for example, choose Start > Programs > Administrative Tools > Computer Management, then expand Services and Applications > Internet Information Services in the left pane. Right click on the Default Web Site icon and choose New > Virtual Directory.
2.
3. 4.
Press the Next button in the wizard which then appears, and name the alias task. Press the Next button and enter the path. If you installed Clarion and Clarion/ASP to their defaults, the path should be <Clarion Root>\examples\asp\todo\asp. Note that there are two directories named asp in this path; be sure to pick the right one. In the Access Permission panel, verify that Read and Run are checked (the first two options in the list. Press Next.
5.
57
6.
Press Finish to close the wizard.
58
Running Your First Test

Clarion/ASP automatically generates an index or table of contents page for you. This allows you to test your procedures easily, but is not meant for deployment (its simply a list of textual links to the procedures, grouped by procedure type). 1. 2. Open your browser. Open the URL http://localhost/task/index.htm. This is the simple list of procedures that Clarion/ASP automatically generates for you as a convenience in testing your application.
If you did not receive an index page listing your procedures, either IIS isnt running or you did not set up your virtual directory correctly. Go back to the beginning of this exercise and review those sections. 3. 4. Click on the link to the Browse/ToDoList. You should be prompted for a log in. Log in. If you cannot log in, be sure that youve added your user ID, password, and email to the aspusers tables using the SQL Enterprise Manager tool.
59
5.
Your browse list probably contains no records. You should see a text link offering to add a record. Click the link.
60 6.
CLARION/ASP Annotated Examples Enter the information for a new record and press the submit button (notice first that the date fields can be filled in directly from the calendar). You should receive an acknowledgement that your insert succeeded. Near the acknowledgement should be a link offering to return you to the list. When you link back, you should see your record.
7.
Within that record, as it appears in the browse, you should see an icon on the right serving as an automatically generated link to an edit page for that record. Click on that link. Press the back button to return to the browse. Use the Insert Record button in the navigation button area to insert another record. When the other record is added, return to the browse. Now that you have two records within the browse, click on the column titles to check the sorting feature. When done, you may simply let the application time out. since there is no such thing as state within an HTML application, there is no exit command, short of closing the browser.
8.
9. 10.
61
Examining the HTML Frames

When it comes time to deploy your applications, many developers will be integrating Clarion/ASP pages in an existing site. Weve included three extra HTML files with this sample application. They demonstrate opening the Clarion/ASP generated pages inside a frame, and calling the pages with HTML parameters. A frame provides a setting for two or more HTML pages, which appear inside it. An HTML parameter is a parameter appended at the end of a URL, separated from the URL with a question mark character. Note that Clarion/ASP did not generate these files; should you wish to create similar ones at your site you must coordinate with your web master. In this section, well open those files using Explorer (as opposed to Internet Explorer). 1. In an Explorer window locate the current Clarion project directory (the one in which you created todolist.app. Open the asp directory located one level beneath it. Right click the file TASKS.HTML and choose Open With... Open it using either an HTML editor (pick yours from the list), or Notepad. This is the frameset file, the holder for two other pages. If you do have an HTML editor, when the file opens, switch to source view.
2.
62
CLARION/ASP Annotated Examples Well call your attention to only four features of the frame: On line three, the <title> tag indicates the title that will appear in the caption bar of the frame. The caption bar text does not change even though the frame contents may. Everything between <title> and </title> will be the caption text. On line six, the <frameset> tag appears, definining this as a frame set. This line indicates the size of each frame. The frames themselves must be described in the following lines, before the </frameset> tag.
In HTML, which is a tagged formatting language, a tag consists of a tagname and optional parameters in angle brackets, as in <tagname parameter1=value1>. Each tag must have a complimentary closing tag consisting of angle brackets, a forward slash, and the tag name, as in </tagname>. On line seven, the first frame is defined. The sequence is always left to right. The src= parameter indicates the location of the HTML page which is to fill the right hand frame. In this case its "todonav.html" which indicates a document in a directory below the asp directory. The actual document name consists of todo, an r meaning right, and nav meaning navigation. It will contain a navigation box with pictures that link to other parts of the application. On line nine, the second frame is declared. This is a simple page with a SoftVelocity logo.
At this point, you may load the frameset and frames 1. 2. In your browser, by typing http://localhost/task/tasks.html. Dont click on any links yet. First, examine the links. Right click in the dark gray area of the navigation bar at the left, but not on one of the pictures. Choose View Source from the popup menu. The HTML source should appear in notepad.
63
At this point well examine the link urls for each of the pictures in the navigation bar. Links start with <a> and end with </a> tags. 1. 2. If wordwrap in Notepad is on, turn it off. Notice line 27, which starts with <div align...> and includes the link to the Reminders browse:
<a href="UpdateToDoListAdd.asp" target="mainFrame"><img src="IMAGES/newnote32x32.GIF" width="30" height="32" border="0"></a>
Each of the links well examine include the parameter target="mainFrame." This instructs the browser to open the target page in the bigger frame at right, which is the main frame (this is the navigation frame). This URL has no parameters (its just UpdateToDoListAdd.asp). Its not necessary to provide any parameter to an add form.
64 3.
CLARION/ASP Annotated Examples Notice line 33, which is the link from the Reminders caption below the second picture. The line includes the following:
<a href="BrowseToDoListList.asp ?WHR=dbo.todolist.Reminder= 1%20and%20dbo.todolist.RemindDate%20%3E= %20GETDATE()%20and%20dbo.todolist.DateCompleted%20IS%20NULL">Reminders</a>
The link is to the browse page, and appends a parameter. The %##s indicate ASCII characters, which translate to the following:
<a href="BrowseToDoListList.asp ?WHR=dbo.todolist.Reminder=1 and dbo.todolist.RemindDate <= GETDATE() and dbo.todolist.DateCompleted IS NULL" >Reminders</a>
?WHR indicates to the ASP code that Clarion/ASP generates that the text following the equal sign should be appended to any default where clause (and in fact there is a where clause existing already for the browse, because weve enabled MyRecords. Note: the GETDATE() function is a TSQL (MS SQL Server procedural language) function which returns todays date. Therefore, the complete query (not including the field list, which is simply abbreviated below, including the My Records filter, and indicating where the user email will be filled in via a session variable) is:
SELECT (fieldlist) FROM dbo.ToDoList WHERE dbo.todolist.Reminder=1 and dbo.todolist.RemindDate <= GETDATE() and dbo.todolist.DateCompleted IS NULL and dbo.todolist.UserName = (UserEmail Session Variable)
In other words, fill the browse only with my records, but only those for which a reminder was set, if the reminder date is today or before, and finally, if the task is incomplete. This page also includes links to the same browse page with different parameters: To Do, and Done. The To Do link contains essentially the opposite of the reminders where clause. The Done link populates the browse with anything marked Complete or 100% percent complete. By providing your web master with the text for the where clause, and advising the web master that the parameter should be named WHR, and that the user identifier is a session variable called UserEmail, you provide your web master with the keys to the kingdom. The web master should be able to open any part of your Clarion/ASP application and zero in on the data, or pre-fill in any forms to an almost unlimited degree. A great deal of scenarios are thoroughly documented in the How - Tos section of the manual.
CLARION/ASP The To Do List Application There are two final links to examine in this particular page. The search link (lines 53 - 54) simply points to the search page, with no parameters:
<a href="UpdateToDoListsearch.asp" target="mainFrame">Search</a>
65
On line 60, a javascript function instructs the top frame to close itself, mimicking an exit function. We included this only because it provided the effect of making this feel like a desktop application. Most web sites will not want to do such a thing!
<a href="javascript:top.self.close();">Exit</a>
At this point, feel free to close the notepad window with the source code and explore the application using the pictures in the navigation bar. Notice that with the first link to one of the task pages youre requested to login.
Help Pages
Notice also that the help links point to HTML pages which appear in popup windows correctly sized to the text. The best way to create your help text is to open the template help files which Clarion/ASP generates for you in an HTML editor. Youll find a text marker labeled Customize your help text here in each of the files that are generated for you in the project\asp\help folder.
Should you wish instead to link to other site pages for help text, simply customize the help page addresses in the procedure(s) you wish.
66
CLARION/ASP Search Contacts Example
67
5.
Search Contacts Example

This exercise walks you through setting up and running the Search Contacts list example application.
The database side of this example is a little trickier than it appears. The Northwind sample database contains two different tables with contact information: customers and suppliers. The unique ID in the former is a string, and the latter, a numeric. This example creates a union of the two tables, and adds a column to hold the contact type based on where it came from. Therefore, the browses will display information from a view. But then to zero in on the data, rather than use the view, the forms will view (they could just as well edit) the original table. This affords us with an opportunity to show you some of the more complicated things you can do with custom links in Clarion/ASP, including creating a dynamic link that calls either one procedure or another, and passes either one parameter or another based on the contact type. Follow these steps to create the application. Note that weve also provided an application called search.app.done should you wish to update your dictionary and simply rename that rather than follow the steps to create your own.
68
Run the Application Wizard

For the sample search app, youll require several tables and views: Customers, Contacts, Orders, Order_Details, Employees, Suppliers, Products, viewProductPhotos, and of course, viewContacts. Note that you will not require the users table: this example will be all view-only, and for that reason, we havent demonstrated security. Start in the Clarion development environment, without opening a dictionary or application. 1. 2. Choose File > New > Application. In the Open File dialog, navigate to the examples\asp\search directory, name the application search.app, and press Save.
Weve included a finished example called complete.app. Feel free to examine this. Important: you cannot generate and run the complete example as is, because you must first edit the connection string to reference your DBMS server. 3. In the Application Properties dialog, select the northwind dictionary (one directory level up), check the Application Wizard checkbox and press OK.
4. 5. 6.
In the Select an Application Wizard dialog, select ApplicationWizard and press Select. Click Next when you see the introductory panel of the Application Wizard. Be sure the Generate Procedures for all Files checkbox is unchecked in the next panel of the wizard.
CLARION/ASP Search Contacts Example 7. Select the tables Customers, Orders, Order_Details, Employees, Suppliers, Products, viewProductPhotos, and viewContacts in the next panel, labeled Select files to Use, then press Next.
69
8.
Press Next on both of the next two panels, then be sure that Generate Reports for All Files is unchecked on the following panel, labeled Finally... Press Finish.
The application wizard appears with a default application containing 32 procedures.
Set the Global Template Options

Begin with your application tree open to the application created in the previous section. To apply the Global template: 1. 2. 3. 4. Press the Global button on the Application Tree toolbar. Press the Extensions button in the Global Properties dialog. Press the Insert button in the Extensions and Control Templates dialog. Locate the ASP Global Template Extension in the Select Template extension dialog. Select it and press Select.
70
The design time template interface for the Clarion/ASP global template appears in the right hand side of the Extension and Control Templates dialog. The first tab of the ASP template interface is labeled Global: 1. Accept the language and help defaults at the top of the tab.
CLARION/ASP Search Contacts Example 2. 3. Skip over the Style Sheet group box; youll find directions for this in the next section. In the HTML Design time templates group box, press the Default Templates button. A default template dialog appears with four edit boxes. The default template provides the setting for the Clarion/ASP browse tables and forms; in essence the background, top, and bottom for the pages. Weve placed an HTML design time template in the examples\search\html directory called search.htm. Type this file name (just the file, not the path) into each of the four boxes in this dialog, and press OK. Accept the defaults for both List and Form defaults. In the Cascading Style Sheets group box, press the Style Sheet Editor button. The next section details the steps necessary for the styles.
71
4. 5.
Set up the Style Sheet

Starting with the Style Sheet Editor dialog, opened in the last section: 1. 2. Press the Insert button to declare a new style. the Style Sheet dialog appears. Type in Silver in the file name box at the top.
3. 4.
Accept the defaults for the hyperlinks styles, and click on the Body Tag tab. For this example, youll create a silver color scheme. For this background, however, well specify that it pick up the color from the design time template. Type COLOR:NONE in the background color box.
72
5.
Click on the Background Class tab. Well specify that it pick up the color from the design time template. Type COLOR:NONE in the background color box. The background class is for the inside of the forms that Clarion/ASP places on the background of the page (the body is for the entire page). Set the background width to 100%. Click on the Data tab. Well specify that it pick up the color from the design time template. Type COLOR:NONE in the background color box. Press the Borders button. Four group boxes, for the top, bottom, left and right border lines each contain three options for the line style, width and color. Set the Line Width for all four sides to thin. Note that youre provided either with specific pixel width choices or relative choices. Set the Line Style for all four sides to solid. Set the colors for the top and left borders to black (the bottom left corner in the color samples boxes).
6. 7. 8. 9. 10. 11.
CLARION/ASP Search Contacts Example 12.
73
Set the bottom and right borders to gray (fourth from the left on the bottom row of the color samples boxes).
13. 14. 15. 16.
Press OK to close the Borders dialog. Back in the Style Sheet dialog, press the Padding button. This controls the fill space around the data grid cells. In the Padding dialog, change the values so that all four boxes are the same value, 2 pixels (abbreviated as px throughout HTML), and press OK. Back in the Style Sheet dialog, press the Header button. This controls the appearance of the text at the very top of browses and forms, in effect, the caption area. Press the ellipsis button next to the background color. In the Color Picker dialog, press Define Custom Colors, click on a blank custom color box, and then in the right side of the dialog, enter 146, 147, and 170 respectively for the red, green, and blue values. The color should be a dark silver. Press the Add to Custom Colors button, then press OK. The value 0AA9392H should appear in the Background Color box.
17.
74 18.
CLARION/ASP Annotated Examples Back in the header dialog, verify that the text alignment is blank. Select and delete any existing value if necessary. By deleting the value from the style, the column header alignment can be set on a procedure-by-procedure basis; if the style contains an alignment value, it will take precedence over the value set in the procedure.
19.
Press the font button. In the font dialog, type COLOR:White in the color box. Press OK to close the font dialog. The header, therefore, will be white text on a dark silver background. Back in the Style Sheet dialog, press the Padding button. This controls the fill space around the data grid cells. In the Padding dialog, change the values so that all four boxes are the same value, 2 pixels (abbreviated as px throughout HTML), and press OK. Back in the Style Sheet dialog, press the Column Label button. In the Column Label dialog, press the ellipsis (...) button next to background color. Select an empty custom color box at the bottom of the dialog, and press the Define Colors button. Enter a new Red/Green/Blue value of 203, 204, 218, press Add to Custom Colors, and then the OK button. The color should be a shade of silver. The value 0DACCCBH should appear in the background color box. Press OK to close the dialog.
20.
21. 22.
75
23. 24.
Back in the Column Label dialog, set the text alignment to Left. Press the Padding button. This controls the fill space around the data grid cells. In the Padding dialog, change the values so that all four boxes are the same value, 2 pixels (abbreviated as px throughout HTML), and press OK, then press OK to close the Column Label dialog. Press the Data Rows button. Well declare two classes for data row appearance. First, however, set the grid spacing thickness to 1. Press the Insert button and type MyDataRow in the class name box. In the same dialog, press the ellipsis (...) button next to background color. Open the Color Picker dialog, press Define Custom Colors, click on a blank custom color box, and then in the right side of the dialog, enter 240, 241, and 245 respectively for the red, green, and blue values. The sample box should show a lighter silver color than the one you defined previously. Press the Add to Custom Colors button, then press OK. The value 0F5F1F0H should appear in the Background Color box. Press OK to close the dialog.
25. 26. 27.
28. 29.
Back in the Data Rows dialog, press Insert to create another class for data row, and type AlternateRow in the class name box. In the same dialog, press the ellipsis (...) button next to background color. Open the Color Picker dialog, press Define Custom Colors, click on a blank custom color box, and then in the right side of the dialog, enter 224, 223, and 227 respectively for the red, green, and blue values. The sample box should show a very slightly darker silver color than the one you defined last. Press the Add to Custom Colors button, then press OK. The value 0E3DFE0H should appear in the Background Color box. Press OK to close the Data Rows dialog.
76 30. 31.
CLARION/ASP Annotated Examples Back in the Style Sheet dialog, press the Footer button, and then the ellipsis button next to background color in the next dialog. In the color picker dialog, locate the color you defined for the header, the darkest gray. Select that box and press OK. The value 0AA9392H should appear in the background color box (RGB 146, 147, 170). Back in the Footer dialog, set text alignment to left, then press OK to close the Footer dialog. Press the Input Label button, press the ellipsis (...) button next to background color, and locate the color you chose for the column labels (the medium gray, the Red/Green/Blue value of 203, 204, 218). The value 0DACCCBH should appear in the background color box. Press OK to close the Input Label dialog. Back in the Style Sheet dialog, press the Input button. In the Input dialog, press the ellipsis (...) button next to the background color. Locate the third color you defined, a light silver (RGB 240, 241, 245). Select that box and press OK. The value 0F5F1F0H should appear in the background color box. Press OK to close the Input dialog. Press OK to close the Style Sheet dialog. Press Ok to close the Style Sheet Editor dialog.
32. 33.
34. 35.
36. 37.
Applying the Style Sheet to the Project

Simply defining the Style Sheet does not apply it to the project. If you were to generate the project now, the ASP pages would not include the HTML tag which merges in the style sheet formatting options. Note that there are four choices. This allows you to define the look of your browse tables, forms, and help popups separately. Note also the additional option for Global Cascading. Because style sheets are merged, you can create a hierarchy of styles, defining some formatting options as a global choice, but then adding additional options separately in style sheets for the forms and browses. Once youve returned to the Global Extensions and Control Templates: 1. 2. Press the Style Sheets button. Select the Silver style sheet you created in the previous section for each of the four cascading style sheet options.
77
3.
Press OK to return to the Global template options.
Run the Connection Wizard

1. 2. 3. While still in the Extension and Control Templates dialog, with the ASP global extension selected, select the Database tab on the right side of the dialog. Press the Connection Properties button on this tab. The Connection Properties dialog appears. Press the Call Connection Builder button.
The Data Link Properties dialog now appears. If ADO and MDAC were not installed with the operating system, they can be installed by Microsoft Office or with the MS SQL Server Enterprise Manager software. Fill in the properties as follows: 1. 2. 3. 4. 5. 6. Select the Provider tab, if the dialog did not automatically open to it, and choose Microsoft OLE DB Provider for SQL Server, then press the Next button. On the Connection tab, enter the server name, or choose it from the drop list in item number 1. Enter the user name and password for the database in item number 2. Check the Allow Saving Password box, in number 2. You must not skip this step, else Internet Information Server has no way to log into the database. Type northwind in the Select the database on the server box. Be sure to test the connection by pressing the Test Connection button. Press the OK button to close the Data Link Properties dialog.
You should have now returned to the Connection Properties dialog, and a connection string something like the one below should appear at the bottom of this dialog:
You may now press the OK button to close the Connection Properties dialog.
78
The BrowseviewContacts Procedure

Youll be applying the browse extension to three of the browse procedures: viewContacts, Orders, viewProductPhotos. This is the first. 1. 2. 3. Locate the BrowseviewContacts procedure in the Application Tree. Right click the procedure and choose Extensions. In the Extensions and Control Templates dialog, press the Insert button. Choose the ASP Browse Extension Template. Now that youve applied the template, on the Data Columns tab, use the delete and up/down keys so that youre left with only the following fields, in the following order: CompanyName, ContactName, ContactTitle, Phone, EditCustomer, EditSupplier, Type and Country.
4. 5.
Youll now customize some of these fields. Click on ContactTitle, and press the Properties button. In the Data Columns dialog, on the first tab, click the Include with Prior Column. This will display the title in the same cell as the preceding column, the ContactName. Next to the checkbox, in the box labelled preceeding text, type in <br>, without the quotes and comma. This is the break tag, indicating there should be a line break inserted before the ContactTitle data value. Press OK to close the data columns dialog.
79
6.
Next, select the EditCustomer field, and press the Properties button. In this field, well define a custom link. The custom link allows you to display data or a graphic, and provides a free form means of specifying the target. This will demonstrate using a combination of static HTML and dynamic VBScript to create the link target. For those developers with some familiarity with HTML, the custom link allows you to define the entire <a></a> tag, with everything inbetween. In the Data Columns dialog, click the Actions tab. Select Custom Link as the Create Column as Link type choice.
7. 8.
80 9.
CLARION/ASP Annotated Examples Type the following exactly as it appears below, in the Custom Link box:
<A HREF=UpdateCustomersView.asp?ID1=" & MID(TRIM(oRSviewContacts.Fields("EditCustomer").Value),1,50) & "><IMG alt='Customer Details' src='images/customerdetail32x32.GIF' border=0></A>
Weve supplied a small text file called cheat sheet in case you dont wish to type this text (and the three others like it, below), or in case youre concerned about making a typo. Its in the project directory. The above code: <A is the beginning of the link tag HREF=UpdateCustomersView.asp?ID=" is the first part of the URL to link to... the edit/view only procedure for the update on the customers table. Note that weve ignored the update on the view. Should you wish to change this to a real update, you need only change the page name.
CLARION/ASP Search Contacts Example & MID(TRIM(oRSviewContacts.Fields("EditCustomer").Value),1,50) This is a VBScript function. The view contains the customers unique ID (a string, such as ALFKI) in the EditCustomer field. The oRSviewContacts.Fields function returns the value of the field named in the brackets (oRSviewContacts is a recordset object that has a Fields method, whose parameter is the field name). The Trim function deletes any trailing spaces. The MID function eliminates any nulls. So this function delivers the customer ID as the ?ID parameter for the update/view function. &"><IMG alt='Customer Details' src='images/customerdetail32x32.GIF' border=0></A> The remainder of the static HTML appends a tag identifying an image to display, its location, the fact that it has no border, and the ending link tab </A>. Therefore, this custom link displays an image, repeated for each customer, and that image serves as a link to a view only update procedure, passing the unique customer identifier for each customer. 10. 11. 12. Press OK to close the Data Columns dialog. Click the Edit Supplier field and press the Properties button.
81
In the Data Columns dialog, on the first tab, click the Include with prior column. This will display the title in the same cell as the preceding column, the ContactName. Leave the next checkbox, with the box labelled preceeding text, blank. This will not place any extra space between the previous column and this. The reason we wish to do this is that because of the way the view is constructed, one or the other of these two columns will always be null. In defining the view, we didnt create a single column for an important reason: so that we could more easily create two completely different hyperlinks. Press OK to close the data columns dialog. In the Data Columns dialog, click the Actions tab. Select Custom Link as the Create Column as Link type choice. Type the following exactly as it appears below, in the Custom Link box:
13. 14. 15.
<A HREF=UpdateSuppliersView.asp?ID1=" & MID(TRIM(oRSviewContacts.Fields("EditSupplier").Value),1,50) &"><IMG alt='Supplier Details' src='images/supplierdetail32x32.GIF' border=0></A>
This code works exactly the same as the custom link code above. The only difference is that its using the Supplier ID (a numeric), a different graphic, and calling a different update/view procedure. Note that theres no need to convert the numeric to a string in the ?ID parameter. All HTML parameters are treated as strings.
82
16. 17. 18.
Press OK to close the Data Columns dialog. Click the Type field and press the Properties button. In the Data Columns dialog, on the first tab, click the Include with prior column. This will display the title in the same cell as the preceding column, the Supplier. In the next box labeled preceding text, type    without the quotes, but with the semi colons. This will place two spaces between the previous column and this. The HTML special character &nbsp stands for non-breaking space. Press OK to close this dialog. In the Data Columns dialog, click the Actions tab. Select Custom Link as the Create Column as Link type choice.
19. 20.
CLARION/ASP Search Contacts Example 21. Type the following exactly as it appears below, in the Custom Link box:
83
<A HREF=" & oRSviewContacts("Type") & "ViewSpecialList.asp?ID1=" & MID(TRIM(oRSviewContacts.Fields("EditCustomer").Value),1,50) &MID(TRIM(oRSviewContacts.Fields("EditSupplier").Value),1,50) &"><IMG alt='View Orders or Products' src='images/" & MID(TRIM(oRSviewContacts.Fields("Type").Value),1,50) &"32x32.gif' border=0></A>
The code above uses the value in the Type field, which will be either Supplier or Customer to call one of two procedures: SupplierViewSpecialList or CustomerViewSpecialList. Neither of these procedures exist on the application tree yet; youll rename the browse suppliers and browse customers procedures to these names. To detail the code piece by piece: <A HREF=" is the beginning of the link tag plus the parameter for the hypertext target. & oRSviewContacts("Type") returns the value from the Type column in the record set. This will always be either Customer or Supplier, which means that as we build the link to the procedure page, we can depend on it always existing. & "ViewSpecialList.asp?ID=" is static text containing the rest of the procedure name to call, and the ?ID=, indicating that the next bit will be the parameter to pass to the procedure page. & MID(TRIM(oRSviewContacts.Fields("EditCustomer").Value),1,50) returns a customer ID if its a customer record, or an empty string if its null, i.e., a supplier record. &MID(TRIM(oRSviewContacts.Fields("EditSupplier").Value),1,50) returns a supplier ID if its a supplier record, or an empty string if its a null, i.e., a customer record. This makes it safe to append to the preceding. &"><IMG alt='View Orders or Products' src='images/" appends the HTML indicating that an image is to be displayed, including its tool tip, which is in the ALT parameter. & MID(TRIM(oRSviewContacts.Fields("Type").Value),1,50) returns the first part of the image file name, i.e., customer or supplier. The two possible images to display are customer32x32.gif and supplier32.32.gif, both of which exist in the /images directory. &"32x32.gif' border=0></A> is the rest of the image file name and the ending link tag. Press OK to close the Data Columns dialog.
22.
84 23. 24.
CLARION/ASP Annotated Examples Click the Country field and press the Properties button. In the Data Columns dialog, on the first tab, click the Include with prior column. This will display the title in the same cell as the preceding column, the link to the update procedure. In the next box labelled preceeding text, type    without the quotes, but with the semi colons. This will place two spaces between the previous column and this. The HTML special character &nbsp stands for non-breaking space. Press OK to close the data columns dialog. In the Data Columns dialog, click the Actions tab. Select Custom Link as the Create Column as Link type choice. Type the following exactly as it appears below, in the Custom Link box:
25. 26. 27.
<A HREF=BrowseViewContactsList.asp?WHR=dbo.viewContacts.Country='" & MID(TRIM(oRSviewContacts("Country")),1,50) &"'><IMG alt='View All From " & MID(TRIM(oRSviewContacts("Country")),1,50) &"' src='images/" & MID(TRIM(oRSviewContacts("Country")),1,50) & ".gif' border=0></A>
This code calls the same browse, but adds a custom where clause, filtering the rows so that only those rows belonging to the same country as the row that was clicked upon appear. Needless to say, this is not a real world feature: its in the sample to illustrate what you can do. It also displays the countrys flag (note that this presupposes that you have all the flags in the directory, in the file format countryname.gif.
CLARION/ASP Search Contacts Example Line by line, the code does the following: <A HREF= BrowseViewContactsList.asp?WHR= dbo.viewContacts.Country='" Provides the link tag, the hypertext targes page name, the ?WHR parameter identifer, the first part of the SQL select statement and a single quote which needs to be passed to the DBMS because the value will be a string. & MID(TRIM(oRSviewContacts("Country")),1,50) returns the name of the country, from the database, protecting against any NULL values. Note that in general, NULLs can wreak havoc with ASP/ADO code. &"'><IMG alt='View All From " provides the first part of the tool tip text. & MID(TRIM(oRSviewContacts("Country")),1,50) provides the country name to finish up the tool tip text. &"' src='images/" & provides the HTML to identify the image file location. & MID(TRIM(oRSviewContacts("Country")),1,50) provides the country name, which is also the file name (without the extension). & ".gif' border=0></A> provides the image file extension and ending link tag.
85
86
Turning Off the Update Link

Press OK once to return to the prompts for the browse extension. This is a view, and you dont wish to lead the end user into thinking they can edit it as is. Therefore, youll wish to cancel the custom link which was populated. 1. 2. 3. Select the Globals tab in the browse extension template. Check the override check box to enable the sub tabs. Uncheck the Create Detail Link as Custom Column checkbox.
4. 5. 6.
Back on the outside tabs of the browse extension, flip to the Custom Columns tab. Select and delete the Automatic Detail Link. Press OK to close the Browse Extensions prompts.
87
The Orders Procedure

The second browse procedure needs to be renamed. As you recall in the last section, we used custom link text to dynamically call procedure pages. From the customer data, we linked to orders, and from the supplier data, we linked to products. The word Customer or Supplier was in the view data; therefore, we wish to rename the BrowseOrders procedure so it contains the word Customer. Weve arbitrarily chosen CustomerViewSpecial, but we could have just have easily chosen CustomerOrdersBrowse. Before you apply the ASP browse extension template, however, open the window for this procedure, and populate two fields from related tables. This will automatically include them in the browse fields. 1. 2. 3. Right click the BrowseOrders procedure in the application tree and choose Window from the popup menu. When the window formatter appears, right click the browse box and choose List Box Format. First, re-order the existing fields, adding any fields necessary so that only the following appear in this order: OrderID, OrderDate, RequiredDate, ShippedDate, EmployeeID, CustomerID, ShipVia, Freight, and ShipName.
88 4.
CLARION/ASP Annotated Examples Still in the window formatter, click on the OrderID field and press the insert field button. In the field list window, select the orders table in the File Browsing List box node, then press the Insert button. Select the Customers table. (Note: Customers will already appear in the left hand pane, in the Other Tables node. You may leave that node as is). Select the new Customers node, which appears as a child to the Orders table, then select the Company Name field from the fields list, then press the select button to bring it into the listbox formatter list. Click on the EmployeeID field in the listbox formatter list, and press the insert field button. In the field list window, select the orders table (again) in the File Browsing List box node, then press the Insert button. Select the Employees table. (Note: Employees will already appear in the left hand pane, in the Other Tables node. You may leave that node as is).
5.
6.
7.
Select the new Employees node, which appears as a child to the Orders table, then select the LastName field from the fields list, then press the select button to bring it into the listbox formatter list.
89
8.
Close and save the Window Formatter changes.
Now you can apply the ASP browse extension: 1. In the Application Tree, highlight the BrowseOrders procedure and choose Procedure > Rename from the Main menu. Rename the procedure CustomerViewSpecial and press OK. Back in the Application Tree, right click the CustomerViewSpecial procedure and choose Extensions from the context menu. This opens the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPBrowse from the Select Extension dialog and press Select.
2.
3. 4.
The Clarion/ASP browse extension template is now applied, and may now be customized. Note that the browse box control in the window structure of this procedure already includes columns from two other tables: the company name from the customers table, and the employee last name from the employee table, which you added in the Window Formatter. You wont have to worry about the SQL necessary to join the tables to display the data from the additional tables because Clarion/ASP will do it for you automatically.
90
CLARION/ASP Annotated Examples The next step is to review the columns in the data columns list, place them in the proper order, place links to other procedures where necessary, and hide some of the columns because theyre unnecessary to the end user (but useful to have in the SQL Select statement). 1. 2. Scroll to and select the Data Columns tab. Verify that the following columns appear in this order by using the up, down, and delete buttons where necessary: CompanyName (from Customer), OrderID, OrderDate, RequiredDate, ShippedDate, LastName (from Employees), EmployeeID, CustomerID, ShipVia, Freight, and ShipName.
3.
Double click the OrderID field; well make this a link to the update form (view only). Note that while we could just enable the automatic detail link as View Only, that would lead to only the data from the view; by linking to the Orders table, well display other information. More importantly, this provides you with experience in populating a link to a procedure manually. In the Data Columns dialog, select the Actions tab. Choose Procedure Link from the Create this column as link dropdown. Choose Data Column from the Pass this data dropdown. Choose Order ID from the Data column to pass dropdown. Choose Update Orders from the procedure to link dropdown.
4. 5. 6. 7. 8.
CLARION/ASP Search Contacts Example 9. Choose View as the type of procedure, and press OK to close the Data Columns dialog. Creating links to another procedure page is a straightforward means of creating a flow from procedure to procedure for the end user. In this case, all Order IDs in the list will appear as links, so that merely by clicking an order the end user sees the order information. Press OK.
91
10. 11. 12. 13. 14. 15. 16.
Back in the Prompts for ASP Browse dialog, double click the Employee ID field to display the Data Columns dialog. This column will serve as a link to the Employee update form (view only). Select the Actions tab. Choose Procedure Link from the Create this column as link dropdown. Choose Data Column from the Pass this data dropdown. Choose Employee ID from the Data column to pass dropdown. Choose Update Employees from the procedure to link dropdown. Choose View as the type of procedure, and press OK to close the Data Columns dialog.
92
CLARION/ASP Annotated Examples Youll set the final four columns in the data columns list so that theyre part of the recordset, but not displayed in the browse. This is useful in that it allows Clarion/ASP to automatically link the tables with join statements (you could delete the fields entirely, but then youd write the SQL yoursellf). Take the following steps on each of these four fields in turn: CustomerID, ShipVia, Freight, and ShipName: 1. 2. Double click the field name. Place a checkmark in the Include in SQL Select but do not Display box, in the top group box of the General tab.
3. 4.
Press OK to close the Data Columns dialog. Press OK twice to close the Extensions and Control Templates dialog.
The Orders browse is now complete.
93
The Browse on the ProductPhotos View

The final browse for modification is the browse on the ProductPhotos view. This procedure, like the last, also requires renaming because the custom links we created before will use the string from the type field (customer or supplier) to dynamically create the name of the procedure page to call. Once youve renamed the procedure, then you can apply the ASP browse extension template: You may optionally modify the listbox control in the window structure of this procedure so that it includes columns from two other tables: the company name from the suppliers table, and the category name from the categories table (since we already demonstrated that in the last section, and its a Clarion, not a Clarion/ASP item, we will not repeat those instructions). To apply the ASP extension: 1. In the Application Tree, right click the BrowseviewProductPhotos procedure and choose Rename from context menu. Rename the procedure SupplierViewSpecial and press OK. Back in the Application Tree, right click the SupplierViewSpecial procedure and choose Extensions from the context menu. this opens the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPBrowse from the Select Extension dialog and press Select.
2.
3. 4.
The Clarion/ASP browse extension template is now applied, and may now be customized. The next step is to review the columns in the data columns list, place them in the proper order, place links to other procedures where necessary, and hide some of the columns because theyre unnecessary to the end user (but useful to have in the SQL Select statement). 1. 2. Scroll to and select the Data Columns tab. Verify that the following columns appear in this order by using the up, down, and delete buttons where necessary: ProductName, Product ID, Supplier ID, Company Name (optional, from the Suppliers table), Quantity per Unit, Photo, Category ID, and Category Name (optional, from Categories).
94
3. 4. 5. 6. 7.
Double click the ProductName field; well make this a link to the update form (view only). In the Data Columns dialog, select the Actions tab. Choose Procedure Link from the Create this column as link dropdown. Choose Data Column from the Pass this data dropdown. Choose Product ID from the Data column to pass dropdown. Note that this time weve chosen one field for display, and a completely different field which will server as the ?ID value when passing the parameter to the update form. Choose Update viewProductPhotos from the procedure to link dropdown. Choose View as the type of procedure, and press OK to close the Data Columns dialog.
8. 9.
Youll set three more columns in the data columns list so that theyre part of the recordset, but not displayed in the browse. Take the following steps on each of these four fields in turn (note: these are not contiguous in the list): Product ID, Supplier ID, and Category ID: 1. Double click the field name.
CLARION/ASP Search Contacts Example 2. 3. 4. Place a checkmark in the Include in SQL Select but do not Display box, in the top group box of the General tab. Press OK to close the Data Columns dialog. Press OK twice to close the Extensions and Control Templates dialog.
95
Although we chose not to display the photos in this particular browse, you can indeed display jpg and gif file data within your browses. We recommend, of course, that you consider the download times, and set the number of rows accordingly, If, for example, you place jpg files in a fifteen row browse, and their average size is 80KB, youve added 1.4MB to the download. The ProductPhotos browse is now complete, and now its time to move on to the update forms.
96
The Update Procedures

The application contains five view only update forms, plus one search form. The first three update forms require little customization.
The Update Customers Form

1. In the Application Tree, right click the UpdateCustomers procedure and choose Extensions from the context menu. This opens the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPForm from the Select Extension dialog and press Select. In the Prompts for ASP Form dialog, select the Actions tab, and uncheck all actions except View, and then check Generate QBF. Select BrowseViewContacts from the Parent Browse Dropdown list (we wish to return the end user back to the special view page instead of the normal parent browse). Press OK to close the Extensions and Control Templates dialog.
2. 3. 4. 5.
6.
The Update Orders Form

1. In the Application Tree, right click the UpdateOrders procedure and choose Extensions from the context menu. This opens the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPForm from the Select Extension dialog and press Select. In the Prompts for ASP Form dialog, select the Actions tab, and uncheck all actions except View, and then check Generate QBF. Select CustomerViewSpecial from the Parent Browse Dropdown list (we wish to return the end user back to the special view page instead of the normal parent browse).
2. 3. 4. 5.
97
6.
Press OK to close the Extensions and Control Templates dialog.
The Update Suppliers Form

1. In the Application Tree, right click the UpdateSuppliers procedure and choose Extensions from the context menu. This opens the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPForm from the Select Extension dialog and press Select. In the Prompts for ASP Form dialog, select the Actions tab, and uncheck all actions except View, and then check Generate QBF. Select BrowseViewContacts from the Parent Browse Dropdown list (we wish to return the end user back to the special view page instead of the normal parent browse). Press OK to close the Extensions and Control Templates dialog.
2. 3. 4. 5.
6.
98
The Update Employees Form

The customizations to this form will consist of adding a photo as a custom control. First, youll need to remove it from the controls list (otherwise it just shows up as high ASCII characters. 1. In the Application Tree, right click the UpdateEmployees procedure and choose Extensions from the context menu. This opens the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPForm from the Select Extension dialog and press Select. In the Prompts for ASP Form dialog, select the Actions tab, and uncheck all actions except View and Generate QBF. Select CustomerViewSpecial from the Parent Browse Dropdown list (we wish to return the end user back to the special view page instead of the normal parent browse). Scroll to and select the Controls tab. Locate the Photo field in the controls list; press the properties button, uncheck the populate option for this field, and close the Controls dialog. Scroll to and select the Custom Controls tab. Press the Insert button. Type Photo as both the control name and caption. Select Above for the control location. When you place a custom control in an update form, you may locate it either above or below all of the edit controls on the form. As always, you may load the runtime HTML template for the update form in an HTML editor, and move the template symbols to any layout you wish. Choose Static Text from the Populate From box, being sure to leave the Enter display text box as blank. Since we dont wish to display anything but the picture, we must indicate there is no data.
2. 3. 4. 5.
6. 7. 8. 9. 10. 11.
12.
99
13. 14. 15. 16.
On the Actions tab, press the Image button to display the Image dialog. Select Data Column from the Populate From dropdown list. Choose Employee ID from the field list dialog for the ID Value column. This indicates the unique value column for use with SQL select statements. Choose Employees from the Select Table dialog for the source table. Note that this and the previous choice allow for populating the image from another table and that Clarion/SQL will then handle the necessary SQL. Select Employee ID column from the fields list for the ID Column. This duplication is necessary because of the option to display an image stored in another table. Select Photo from the fields list for the image column. Note that in previous steps, you ran a command file that loaded the employee table with photographs. These are not part of the Northwind sample database by default. Select jpg from the Image type dropdown list.
17.
18.
19.
100
20.
Press OK three times to return to the Application tree.
The Update viewProductPhotos Form

The Northwind database in its default form has no product photos field. The database you attached contains a product photos table, consisting of the product ID and the binary field for the photo. It also created a view called viewProductPhotos, consisting of both the products and product photos tables. The only customization necessary for this procedure is to add the photo. 1. In the Application Tree, right click the UpdateviewProductPhotos procedure and choose Extensions from the context menu. this opens the Extensions and Control Templates dialog. Press the Insert button to insert a new extension. Choose ASPForm from the Select Extension dialog and press Select. In the Prompts for ASP Form dialog, select the Actions tab, and uncheck all actions except View and Generate QBF. Select SupplierViewSpecial from the Parent Browse Dropdown list (we wish to return the end user back to the special view page instead of the normal parent browse). Scroll to and select the Custom Controls tab. Press the Insert button. Type Photo as both the control name and caption. Select Below for the control location. Choose Static Text from the Populate From box, being sure to leave the Enter display text box as blank. Since we dont wish to display anything but the picture, we must indicate there is no data.
2. 3. 4. 5.
6. 7. 8. 9. 10.
101
11. 12. 13. 14. 15. 16.
On the Actions tab, press the Image button to display the Image dialog. Select Data Column from the Populate From drowdown list. Choose Product ID from the field list dialog for the ID Value column. This indicates the unique value column for use with SQL select statements. Choose viewProductPhotos from the Select Table dialog for the source table. Select Product ID column from the fields list for the ID Column. Select Photo from the fields list for the image column. Note that in previous steps, you ran a command file which loaded the employee table with photographs. These are not part of the Northwind sample database by default. Select jpg from the Image type dropdown list. Press OK three times to return to the Application tree..
17. 18.
102
Generate the ASP Pages

Congratulations! Youve finished setting up your Clarion/ASP application and are ready to generate and test on your local machine. The generation process is no different than normal Clarion source code generation. The only difference is that in addition to the Clarion source code modules, the application generator also produces .asp pages, as well as htm files. To generate your project, with only the Application Tree window open, choose Project > Generate All from the development environment menu.
103
The Frames
This application utilizes a simple two part (left and right )HTML frame, which is provided to you in the project\asp\html directory. The main feature of the frame is a search form on the left that allows the end user to specify category type (contact or supplier), plus type in all or part of the contact name, company name and country name.
The Search Frame

This frame is a slightly modified query by form page, and was produced by Clarion/ASP. This page was modified after generation in an HTML editor to make it narrow enough to serve as a navigation frame. Clarion/ASP outputs HTML runtime templates. These are normal HTML pages with symbols (existing simply as HTML text) representing the locations in which the ASP page will place its fields and labels at the time it merges the data and the template to output the page that the end user sees in the browser. Because the form fields correspond to the field names in the database (pre-pended with txt), its simple to load the runtime template into an HTML editor, and quickly identify the part you wish to move. Its very important to note that after youve edited the file that unless you turn off the HTML generation (on the Clarion/ASP global properties/generation tab), your changes will be overwritten. The HTML runtime templates reside in the project\asp\html directory. They share the same name as their corresponding asp file name (i.e., the procedure name, plus list, add, edit, view, or search. For the search example, weve supplied the modified HTML template, and placed it outside that directory, so that you wont overwrite it by issuing the Generate command before youve read this section. This file is located in the project directory. We suggest that you copy it into its normal location, but then set the file attribute to read only, so that you wont accidentally overwrite it. Note that this will produce a warning during the generate process. 1. 2. 3. Locate the \Clarion6\examples\asp\search\UpdateviewContactsSearch.htm file. (Again, we are assuming a root of Clarion6. Your install may vary). Copy it to the \Clarion6\examples\asp\search\asp\html directory. Right click on the following file: \Clarion6\examples\asp\search\asp\html\UpdateviewContactsSearch.htm that you just copied and choose Properties from the context menu. Check the Read Only attribute box and press OK to change the property.
4.
104
CLARION/ASP Annotated Examples You can also turn off the HTML generation option, but we recommend that until youre thoroughly familiar with what files Clarion/ASP creates and where it places them that you use this method.
Additionally, we set the target of the Submit and Reset buttons so that the search results would output to the main frame, leaving the search frame always available to the end user, at the left hand side. Needless to say, should the end user not type in any parameters, but instead merely push the submit button, a target page, the browse on the contacts view, would appear without any filter. Because you copied the HTML file, you do not need to perform any editing; however, so that you can understand how we modified the HTML, below are the steps which would be taken if you did have to modify the HTML. Compared to the customization of the HTML page and elements, the customization for the form target isnt as readily available because the <FORM> tag is stored in the ASP page, and not in the HTML page. To duplicate this functionality, you would hand edit the ASP page you generated as follows: 1. 2. Open the generated page, which is project\asp\UpdateviewContactsSearch.asp. You may load it into notepad. Search for FormDeclaration. Youll find the following line:
FormDeclaration = "<form name='form1' id='form1' method='POST' action='BrowseviewContactsList.Asp' >"
105
3.
Insert the following before the closing angle bracket:
target='mainFrame'
The complete line should look like this:

FormDeclaration = "<form name='form1' id='form1' method='POST' action='BrowseviewContactsList.Asp' target='mainFrame'>"
4. 5. 6.
Save the file and exit notepad. Right click the project\asp\UpdateviewContactsSearch.asp which you just edited and choose Properties from the context menu. Check the Read Only attribute box and press OK to change the property.
Final Note: should you wish to enable security on an application such as this, you could easily enable it on all pages except the search frame. This would allow all users to load the frame and see the search form, plus an introductory page (described below). The login would appear only after the end user pressed the submit button. There are two methods you could use to create the search from without security: (1) turn off security on the UpdateviewContactsSearch procedure. Since this application doesnt use this procedure except for the search (it uses the UpdateCustomer and UpdateSupplier, but not this one), that presents no problem. But what if you wished to accomplish the same in another application, and you wished a regular update to have security on for the update, but off for the search? In that case (2) you must generate all the pages with security on,
106
CLARION/ASP Annotated Examples copy the generated pages to another directory, regenerate with security off, and copy just the search page to that other directory. Alternately, you can edit the single generated page for the search. A single line turns on security; you could delete it, or comment it out (place a single quote character at the beginning of the line:

Generate the Project

You may now generate the project with the Project > Generate All command. Please note, however, you will receive a compiler warning, because the template will attempt to overwrite the read-only search form runtime template you previously copied to the asp directory. Simply ignore the error.
Examining the Frame Set

The Frame Set refers to an HTML page which merely contains information placing two or more other HTML pages inside it. The frame set for this project is called default.htm, and a copy resides in the project\asp directory:
<html> <head> <title>Northwind Contact Search</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <frameset cols="171,*" frameborder="NO" border="0" framespacing="0" rows="*"> <frame name="leftFrame" scrolling="NO" noresize src="UpdateviewContactssearch.asp"> <frame name="mainFrame" src="html/intro.htm"> </frameset> <noframes><body bgcolor="#FFFFFF" text="#000000"> </body></noframes> </html>
The HTML above simply sets the page title, the size of the navigation (or search frame), the names of the two pages which will be placed in the left frame and main frame, and a body background color.
The Main Frame

The initial page which appears in the main frame, as per the HTML frame set code above, is called intro.htm. This is simply a page with a logo and short instructions. Since the application has to first tell people what they can search for (via the search frame) before they actually begin viewing the date, it makes sense to show simple instructions.
CLARION/ASP Search Contacts Example The following is the code for the intro window:
107
<title>SoftVelocity Demo Center -- Clarion/ASP</title> <body bgcolor="#EFF3FF"> <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" height="100%"> <tr> <td align="center" valign="middle"> <p> </p> <p><img src="/IMAGES/SoftVelocityLogo240w.GIF" width="240" height="127"></p> <p>This demonstrates Clarion/ASP flexibility in dynamically calling various procedures based on end user selections.</p> <p>Enter search criteria to begin the demo.</p> </td> </tr> </table>
108
Setting Up the Virtual Directory in IIS

The output is placed in the project\asp directory, as well as directories beneath it called HTML, images, and styles. Before you may test, however, you must tell Internet Information Server where the application is: 1. From the Windows Start menu, choose Start > Programs > Administrative Tools > Internet Information Services (the exact name and location of the IIS configuration manager may vary slightly from version to version of Windows.
2. 3. 4. 5.
Open each successive node in the tree pane at the left of the Internet Information Services manager until you can see the Default Web Site node. Right click on the Default Web Site node and from the popup menu, choose New > Virtual Directory. Press Next to skip past the introductory pane of the Virtual Directory Wizard. On the second pane, enter search in the Alias box. This will serve as the name for the virtual directory. Press Next.
109
6.
Press the Browse button next to the Directory box on the next panel. Browse to the applications directory, then locate the asp directory beneath it and select the asp directory. If youve installed to the default Clarion directory and followed our suggestion for the application directory name above, that directory should be \CLARION6\examples\asp\search\asp.
7.
Press the Next button twice, and the Finish button, accepting the defaults.
110
Running Your First Test

Clarion/ASP automatically generates an index or table of contents page for you. This allows you to test your procedures easily, but is not meant for deployment (its simply a list of textual links to the procedures, grouped by procedure type). 1. 2. Open your browser. Open the URL http://localhost/search/index.htm.
If you did not receive an index page listing your procedures, either IIS isnt running or you did not set up your virtual directory correctly. Go back to the beginning of this exercise and review those sections. 3. 4. Click on the link to the Browse/BrowseviewContactsList.asp. Examine the browse (which should be non-filtered, and contain all the customer/supplier records, approximately 120 total) and verify that it looks the way it should: A company name column, a contact/title column, a phone number, and a column at the right with three graphics, which should lead to either customer or supplier view form, an orders or products browse filtered to the selected row ID, or another contacts browse filtered to the country of the selected row ID.
CLARION/ASP Search Contacts Example 5. Navigate through the subsequent links and verify that you see the various view only update forms, including those for products and employees, which should display the photos.
111
Testing the Search Frame

Now you can test the search frame: 1. 2. Open the URL http://localhost/search/default.htm. Type a letter such as M or J in the contact name field and press the Submit button.
3.
Verify that the browse which appears in the main frame (the right hand side) is properly filtered to show only those contacts whose first names start with the letter you just typed.
Congratulations, youve built the search application! Explore the rest of the application as desired. Youll find view only update forms and pictures of employees and products.
112
CLARION/ASP Orders Example
113
6.
The Orders Example

The Orders example provides an opportunity to show how extensible Clarion/ASP is. This chapter will set up more complex behaviors, such as forms and browses on the same procedure page, and demonstrate the editing of the generated ASP and HTML runtime template pages. Additionally, you may further use the application as a jumping off point for demonstrating the use of VBScript in Clarion/ASP embed points (as documented in the Users Guide). Youll find those pages which were customized post generation in a file called custom.zip in the project\asp\ and project\asp\html directories. Feel free to unzip and use these files if you wish to follow the Users Guide in editing the pages. Again we are assuming a root folder named Clarion6. Your root may be diiferent.
Setup and Global Properties

1. 2. Choose File > New > Application. Navigate to Clarion6\examples\asp\Orders in the Open File dialog, and name your Application Orders.app.
Weve included a finished example called complete.app. Feel free to examine this. Important: you cannot generate and run the complete example as is, because you must first edit the connection string to reference your DBMS server. 3. Choose the Northwind dictionary in the Application Properties. Make sure the Application Wizard box is checked and run the Application Wizard (not Quick Start). Uncheck the Include all files box; instead, include only the following tables/views: Employees; Categories; Customers; Shippers; Suppliers; Orders; view Order Details Extended; Managers; Order Details; Products; view Orders Query. Uncheck the Generate All Reports option.
4.
Apply the Global template/Connection Properties 1. 2. 3. From the development environment menu, choose Application > Global Properties. In the Global Properties dialog, press the Extension button, then the Insert button. In the Extension and Control Templates dialog, press the Insert button.
114 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14.
CLARION/ASP Annotated Examples Choose the ASP Global Extension Template (class SV ASP) in the Select Extension dialog and press the Select button. In the Extension and Control Templates dialog, with the ASP global extension selected, select the Database tab on the right side of the dialog. Press the Connection Properties button on this tab. The Connection Properties dialog appears. Press the Call Connection Builder button. Select the Provider tab, if the dialog did not automatically open to it, and choose Microsoft OLE DB Provider for SQL Server, then press the Next button. On the Connection tab, enter the server name, or choose it from the drop list in item number 1. Enter the user name and password for the database in item number 2. Check the Allow Saving Password box, in number 2. You must not skip this step, else Internet Information Server has no way to log into the database. Type northwind in the Select the database on the server box. Press the Test Connection button, and verify that you receive a success message. If not, review the settings in this dialog. Press the OK button to close the Data Link Properties dialog. You should have now returned to the Connection Properties dialog, and a connection string something like the one below should appear at the bottom of this dialog: Provider=SQLOLEDB.1;Password=YourPassword;Persist Security Info=True;User ID=YourUsername;Initial Catalog=northwind;Data Source=YourDataServer. Press the OK button to close the Connection Properties dialog.
15.
General Tab
Style Sheet
1. 2. 3. 4. In the Global Extension dialog, click on the Global tab. In the Cascading Style Sheets group box, press the Style Sheet Editor button. Press the Insert button to declare a new style. The Style Sheet dialog appears. Type in MyStyles in the file name box at the top.
CLARION/ASP Orders Example 5. 6. 7. Accept the defaults for the hyperlinks styles, and click on the Body Tag tab. Set the body width by typing 100% in the width box.
115
Set the body color. Delete the current background color (COLOR: White). Press the ellipsis next to the background color. Click on a blank custom color box. Define a new custom color with the RGB values of 255, 243, and 255. The color should be an off white. Select Add to Custom Colors and press OK. The value 0FFF3FFH should appear in the background color box.
8. 9. 10. 11. 12.
Set the text alignment to null by choosing the bottom (empty) dropdown. Click on the Background Class tab. Set the width to 100% by typing it in the width box. Set the background color to COLOR:NONE by typing it in the background color box. Click on the Data tab. Set the width to 100% by typing it in the width box. Delete the current background (0FF990H). Press the ellipsis next to the background color. Click on a blank custom color box; either below or to the right of the first custom color box that you filled previously. Define a new custom color with the RGB values of 255, 153, and 0. The color should be somewhat orange. Select Add to Custom Colors and press OK. The value 099FFH should appear in the background color box.
116 13.
CLARION/ASP Annotated Examples Press the Borders button. Four group boxes, for the top, bottom, left and right border lines each contain three options for the line style, width and color. Set the Line Width for all four sides to thin. Set the Line Style for all four sides to solid. Set the Background Color box for all four sides to COLOR:NONE. The grid, therefore, will pick up the surrounding color when it divides the individual cells in the grid.
14. 15.
16. 17.
Press OK to close the Borders dialog. Back in the Style Sheet dialog, in the sub classes group, press the Header button. This controls the appearance of the text at the very top of browses and forms, in effect, the caption area. Delete the current background color (0FF990H). Press the ellipsis button next to the background color. In the Color Picker dialog, press Define Custom Colors, click on a blank custom color box and in the right side of the dialog define a new custom color with 198, 89, and 24 respectively for the red, green, and blue values. The sample box should show a brown-ish color.
18.
117
Press the Add to Custom Colors button, then press OK. The value 01859C6H should appear in the Background Color box. 19. 20. Back in the header dialog, set the text alignment to left. Press the font button. In the font dialog, delete the current font color (COLOR:Black), and press the ellipsis next to the color. Locate the color you created for the body (values of 255, 243, and 255). The color should be off white. The value 0FFF3FFH should appear in the background color box. Press OK to close the font dialog. Back in the Style Sheet dialog, press the Column Label button. In the Column Label dialog, delete the current background color and press the ellipsis (...) button next to the background color box. Click on a blank custom color box. Define a new custom color with the values of 120, 168, and 255. The color should be light blue. The value 0FFA878H should appear in the background color box. Press OK to close the dialog. Back in the Column Label dialog, set the text alignment to Left. Press the Font button, delete the current value (COLOR:Black) and set a new font color: press the ellipsis (...) button next to background color. Click on a blank custom color box. Define a new custom color with the values of 222, 235, and 239. The color should be yet another shade of off white. The value 0EFEBDEH should appear in the background color box. Press OK to close the dialog, and OK once more to close the Column Label dialog. Press the Data Rows button. Well declare two classes for data row appearance. First, however, set the grid spacing thickness to 1. Press the Insert button and type MyDataRow in the class name box in the Data Rows dialog. In the same dialog, delete the current background color (0DCDCDCH) and set a new background color: choose the custom color you defined for the column label text (values of 222, 235, and 239, another shade of off white. The value 0EFEBDEH should appear in the background color box. Set text alignment to null (last "empty" entry in the dropdown list).
21. 22.
23. 24.
25. 26. 27.
28.
118
29. 30.
Back in the Data Rows dialog, press Insert to create another class for data row, and type AlternateRow in the class name box. In the same dialog, delete the current background color (0DCDCDCH) and press the ellipsis (...) button next to background color. Open the Color Picker dialog, and choose the very first custom color you created (one of the off whites; RGB values 255/243/255, Hex value 0FFF3FFH. Set text alignment to null (last "empty" entry in the dropdown list). Press OK to close the Data Rows dialog. Back in the Style Sheet dialog, press the Footer button. Delete the current background color (0FF9900H) and then press the ellipsis button next to background color in the next dialog. Set a new background color: click on a blank custom color box. Define a new custom color with the values of 239, 150, and 123, hex 0FFF3FFH. The color should be brown-ish-red. The value 07B96EFH should appear in the background color box. Back in the Footer dialog, set text alignment to left, then press OK to close the Footer dialog. Press the Input Label button, delete the current background color and press the ellipsis (...) button next to background color. Click on a blank custom color box. Define a new custom color with the values of 242, 242, and 242. The color should be off white. The value 0F2F2F2H should appear in the background color box. Press OK to close the dialog. Back in the Input Label dialog, Press the Font button, delete the current font color (COLOR:Black) and set a new font color: press the ellipsis (...) button next to background color. Click on a blank custom color box. Define a new custom color with the values of 32, 32, and 32. The color should be dark gray. The value 0202020H should appear in the background color box. Press OK to close the dialog, and OK again to close the Input Label dialog. Back in the Style Sheet dialog, press the Input button. In the Input dialog, delete the current background color (0DCDCDCH) and press the ellipsis (...) button next to the background color.Select the off white defined
31. 32.
33. 34.
35.
36. 37.
CLARION/ASP Orders Example for the MyDataRow (RGB values 222/235/239, hex 0EFEBDEH. Press OK to close the Input dialog. 38. 39. 40. Press OK to close the Style Sheet dialog. Press OK to close the Style Sheet Editor dialog. Press the Style Sheets button and choose the MyStyles style sheet for all four options. Then press OK to close the dialog and apply the style choices at the global level.
119
Design Time Template

1. Verify that the attachment (generic.htm) is located in your project\HTML directory. This template provides for links to what will be the switchboard (which will act as a limited table of contents) and to selected query pages. When creating Clarion/ASP projects its useful to consider a design time template such as this so that every single part of the application will have access to the other parts.
Below is the design time template, as loaded in an HTML editor. Note the links in the small table at upper left. Note also that the Clarion/ASP symbol (into which AppGen will merge its code when generating the runtime templates from this plus the template options) is located in another table, which will center the Clarion/ASP content (this is only an option and is not required of your applications.
120 2. 3. 4.
CLARION/ASP Annotated Examples Press the Default Templates button on the Global tab. Type generic.htm into each of the four boxes for the design time template. Press OK to close the dialog.
121
List Defaults
1. 2. 3. 4. 5. Press the List Defaults button on the Global tab. Set the Data Records per HTML list to 6 rows. Uncheck Show Add Button on DB Navigation Bar. Where desired, we will add a custom new button to the various procedures. Uncheck the Show QBF Button on DB Navigation Bar. The design time template will contain links to the queries we wish to allow. Press OK to close the dialog.
Security Tab
This next set is optional. This chapter will not mention user level security at the procedure levels. Should you expect to deploy this sample application to a server connected to the Internet, by all means apply security, and set access levels according to those used by your security table. 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. Click on the Security tab in the global extension. Check the Provide User Based Security box. Set the User Table to aspusers (or whichever security table you use). Set the unique ID column to ID. Set the login name column to Email. Set the login password column to password. Set the Security Level column to accesslevel. Set the User email column to email. Set the user name column to First_Name. Set the second user name column to Last_name.
122
Administration Tab
1. 2. 3. Click on the Administration tab in the global extension. Type "Northwind Traders" in the Site Title box. Press OK to close the global extensions.
123
Prep the Procedures

Apply the ASP browse and form templates (according to whichever is applicable) to the following procedures, accepting all the defaults for now. Note: it may help to click the "Category" tab in the app tree, so that you view the procedures by type. BrowseCategories BrowseCustomers BrowseEmployees BrowseOrders BrowseOrder_Details BrowseProducts BrowseShippers BrowseSuppliers Browse_view_order_details_extended (youll be required to set the unique key to keyOrderProd on the HTML Table tab for this one because there is no key with a PRIMARY attribute in the dictionary. Weve done this purposely, because you may sometimes encounter VIEW definitions in which one was not declared.) SelectCategories SelectManagers SelectOrders SelectProducts UpdateCategories UpdateCustomers UpdateEmployees UpdateOrders UpdateOrder_Details UpdateProducts UpdateShippers UpdateSuppliers UpdateViewOrdersQuery
124
The Browse Procedures

Note that later in this chapter, when its time to explain editing generated ASP code that we will do further customizations some of these same browses.
Customize the BrowseProducts procedure:
1. 2. 3.
Open the BrowseProducts procedure. Open the window, right click on the browse box and open the list formatter. Add a new field. In the select column dialog, File Browsing Listbox node, click on the Products table, press the Insert button, and choose the Categories table. Select the Category Name field from the right hand pane. Note that though the Categories table is already in the "Other Tables" node, you must still insert it.
CLARION/ASP Orders Example 4.
125
Add another new field. In the select column dialog, File Browsing Listbox node, click on the Suppliers table, press the Insert button, and choose the CompanyName field from the right hand side. Note that though the Suppliers table is already in the "Other Tables" node, you must still insert it.
5. 6. 7. 8.
Close the ListBox and Window formatters, and open the ASP browse extension. On the Data Columns tab, press the Insert button, insert the CAT:CategoryName field and press OK. On the Data Columns tab, press the Insert button, insert the SUP:CompanyName field and press OK. Double click the CategoryID field, and check the "Include in SQL Select but do not display box." The logic is that there is no need for the end user to view ID number fields. Double click the ProductID field, and check the "Include in SQL Select but do not display box." Double click the SupplierD field, and check the "Include in SQL Select but do not display box."
9. 10.
126
11. 12.
Reorder the fields to the following order: Product Name Category Name Supplier Company Name Quantity Per Unit Unit Price Units in Stock Units On Order Reorder Level (the CategoryID, ProductID and SupplierID fields can be in any order) Format the Unit Price field by Double clicking it, opening the appearance tab and setting the formatting functions dropdown to currency, and choosing 2 digits after decimal. Press OK.
127
Double click the Category/CategoryName field. Click its Actions tab. Set the first dropdown to Procedure Link. Specify passing a data column. In the Data Column to pass, specify PRO:CategoryID. Set the procedure to link to to UpdateCategories. Set the Action to View. Click OK. Throughout the browses you will insert links to related tables wherever possible. Double click the Supplier/CompanyName field. Click its Actions tab. Set the first dropdown to Procedure Link. Specify passing a data column. In the Data Column to pass, specify PRO:SupplierID. Set the procedure to link to UpdateSuppliers. Set the Action to View. Click OK.
14.
15. 16.
On the Page tab, press the Regenerate SQL button. Close the Procedure.
128
Browse Customers Procedure
1. 2. 3. 4.
Open the BrowseCustomers procedure, ASP extension. Select the Data Columns tab. Double click the CustomerID tab and check the "Include in SQL select but do not display" button. Double click the Contact Title column. Check the "Include with Prior Column" box. Enter <BR> in the "preceding text" box (line break). In this table we will include a multi line address column.
129
5. 6. 7.
Double click the Address column. Check the "Include with Prior Column" box. Enter <BR> in the "preceding text" box (line break). Double click the City column. Check the "Include with Prior Column" box. Enter <BR> in the "preceding text" box (line break). Double click the Region column. Check the "Include with Prior Column" box. Enter in the "preceding text" box (non breaking space).
130
8.
Double click the Postal Code column. Check the "Include with Prior Column" box. Enter    in the "preceding text" box (two non breaking spaces). (Note: leave the Country field as is; this is a useful column to separate, in that sorting by country could be desired). Close and save the changes for the procedure by pressing OK.
9.
131
The Browse Employees Procedure
1. 2. 3.
Open the BrowseEmployees procedure, ASP extension. Click on the Data Columns tab. Use the Delete button so that you have only the following fields: Last Name, First Name, Employee ID, Title, Birth Date, Hire Date.
132
4. 5.
Double click the Employee ID field and check the "Include in SQL select but do not display" button. Double click the First Name field. Click the column sorting tab. Uncheck the enable sorting button. There is no need to include extraneous sort options.
133
6. 7. 8.
Double click the Title Name field. Click the column sorting tab. Uncheck the enable sorting button. Click the Page tab and press the Regenerate SQL button. Click the HTML table tab, check the "populate an entry locator" button, and select the Last Name field from the drop down field list. (Note: there are only 8 employees in this table; this is just for practice!).
134
9.
Close and save the Browse Employees procedure by pressing OK.
135
The Browse Orders Procedure
1. 2. 3.
Open the Browse Orders procedure. Open the window, right click on the browse box and open the list formatter. Add a new field. In the select column dialog, click on the Orders table, press the Insert button, and choose the Customers table. Select the Company Name field from the right hand pane. Note that though the Customers table is already in the "Other Tables" node, you must still insert it. Add a new field. In the select column dialog, click on the Orders table, press the Insert button, and choose the Employees table. Select the Last Name field from the right hand pane. Note that though the Employees table is already in the "Other Tables" node, you must still insert it.
4.
136
5.
Add a new field. In the select column dialog, click on the Orders table, and from the right hand side, select the ORD:RequiredDate field (the original SQL field, not the Clarion group). Add a new field. In the select column dialog, click on the Orders table, and from the right hand side, select the ORD:ShippedDate field (the original SQL field, not the Clarion group). Add a new field. In the select column dialog, click on the Orders table, and from the right hand side, select the ORD:OrderDate field (the original SQL field, not the Clarion group). Add a new field. In the select column dialog, click on the Orders table, and from the right hand side, select the ORD:PostalCode field. Add a new field. In the select column dialog, click on the Orders table, and from the right hand side, select the ORD:Country field. Close the listbox and window formatters. By adding file drop control templates to a window you instruct Clarion/ASP to provided a table loaded dropdown instead of a button which leads to a select browse. Open the asp extension. Select the Data Columns tab, and using the Insert button, add CUS:CompanyName, EMP:LastName, ORD:OrderDate, ORD:RequiredDate, ORD:ShippedDate, ORD:PostalCode, and ORD:Country to the list of controls.
6.
7.
8. 9. 10.
11. 12.
CLARION/ASP Orders Example 13. 14. 15.
137
Double click on OrderID, CustomerID, and EmployeeID, and for each check the "Include in SQL Select but do not display" box. Using the delete button, delete the Freight field. Make sure the field order is as follows: OrderDate, CustomerCompanyName, Employee Last Name, Required date, Shipped date, Shipped Via (the shipper ID), Ship Name, Ship Address, Ship City, Ship Region, Ship Postal code, and ShipCountry. The order of the "do not display fields" (OrderID, CustomerID, and EmployeeID) doesn't matter.
16. Double click the Company Name field and click the Actions tab. Set the field up as a Procedure Link, passing the column ORD:CustomerID, to the UpdateCustomers procedure, in View mode. 17. Double click the Employee Last Name field and click the Actions tab. Set the field up as a procedure link, passing the column ORD:EmployeeID, to the UpdateEmployees procedure, in View mode. 18. Double click the Ship Via field and click the Actions tab. Set the field up as a procedure link, passing the column ORD:ShipVia, to the UpdateShippers procedure, in View mode. note that ShipVia is the ID number for the shipper in this table layout.
138
CLARION/ASP Annotated Examples 19. Double click the Ship Name column. Check the "Include with Prior Column" box. Enter    <i>Shipped to:</i><BR> in the "preceding text" box. To explain: the shipper number (the previous column) will be a hyperlink. Following that will be two spaces, the words "Shipped to" in italics, a line break, and then the ship name.
20. 21. 22. 23. 24.
Double click the Ship Address column. Check the "Include with Prior Column" box. Enter <BR> in the "preceding text" box. Double click the Ship City column. Check the "Include with Prior Column" box. Enter <BR> in the "preceding text" box. Double click the Ship Region column. Check the "Include with Prior Column" box. Enter in the "preceding text" box. Double click the Ship Postal Code column. Check the "Include with Prior Column" box. Enter    in the "preceding text" box. Click the Page tab and press the Regenerate SQL button.
139
25. 26. 27.
Click the Custom Controls tab. Double click the Automatic Details Link which the template already generated. In the Procedure to Link dropdown list, change the target procedure to UpdateviewOrdersQuery and press OK. This is a view only update form upon an existing view in the database. Close the Browse Orders procedure.
28.
140
The Browse View Order Details Extended Procedure

1. 2. 3. Open the Browse view Order Details Extended procedure, ASP extension. Click the Data Columns tab. Double click the Order ID field. Check the Include in SQL Select but do not display box. Select the Custom Columns tab. Double click the Automatic Detail Link. Change the Procedure to Link to the Update Order Details procedure and press OK.
This is a very important concept. In some of the example procedures above, we let the template create a custom JOIN select. Here we used a VIEW already present on the DBMS. The only drawback is that we dont accept an automatic detail link to the update in these cases (some DBMSs support updatable VIEWs, but its best to avoid them). When using a VIEW for the browse, its simple enough to point the update to an update(s) on the component table(s).
141
In general, using VIEWs for the browse is better because the DBMS probably optimizes VIEWs, hence, returns the data faster than had you used a SELECT with JOIN. This exercise demonstrates both methods so that you know that you can use either. 4. 5. 6. 7. Back on the Custom Columns tab, press the Insert button to add a new custom column. Name the column Add by typing it in the Column Name box. From the Create Column as Link dropdown, choose Custom Link. Type the following in the Custom link box. It calls the Add procedure for the Order Details table and primes the invoice number by setting the value of the text box in the HTML form which will contain the variable via a URL parameter. Note that custom links are just one way to prime a form; using a static link with additional parameters is another.
<A HREF=UpdateOrder_DetailsAdd.asp?txtOrder_DetailsOrderId=" & oRSview_Order_Details_Extended.Fields("OrderID").Value & "><IMG SRC='" & IconAdd & "' BORDER='" & IconBorder & "' HEIGHT='" & IconHeight & "' WIDTH='" & IconWidth & "' ALT='Insert New Item'></A>
8.
Save the Order Details Extended procedure.
142
The Browse Categories Procedure

This procedure demonstrates enabling the end user to click on the lookup button and return a single value to a selected field. The Select Products example later in this chapter will demonstrate returning two values.
1. 2.
Open the Browse Categories procedure, ASP extension. Click the Data Columns tab. Select the Picture field and press the Delete button. You may include a graphic image in a browse, but it must be in the custom controls list. For this procedure, we will simply delete it. On the Page tab, press the Regenerate SQL button.
3.
143
The Select Managers Procedure

This select/lookup browse is called by the Employees update form.
1. 2. 3. 4. 5. 6. 7. 8.
Open the Select Managers procedure, ASP extension. Select the Page tab, and check the This is a Select Procedure box. Set MGR:Last Name as the column to hyperlink. Press the Column Assignments button, then Insert to add an assignment. Press the ellipsis button next to the Column to Fill From box. Click MGR:EmployeeID and press the Select button. Press the ellipsis button next to the Target Column box. Select the Other Tables node in the Tables pane of the Select Column dialog, press the Insert button, add the Employees table, then select EMP:EmployeeID field (the Employee update will be the calling procedure). Press OK three times to close the dialogs and save the procedure changes.
9.
144
The Select Orders Procedure

This select/lookup procedure is called by the Order Details update. 1. 2. 3. 4. 5. 6. 7. 8. Open the Select Orders procedure, ASP extension. Select the Page tab, and check the This is a Select Procedure box. Set ORD:OrderID as the column to hyperlink. Press the Column Assignments button, then Insert to add an assignment. Press the ellipsis button next to the Column to Fill From box. Click ORD:OrderID and press the Select button. Press the ellipsis button next to the Target Column box. Select the Other Tables node in the Tables pane of the Select Column dialog, press the Insert button, add the Order Details table, then select ORD2:OrderID field (the Order Details update will be the calling procedure). Press OK three times to close and save the procedure changes.
9.
The Select Products Procedure

This select/lookup procedure is called by the Order Details update. 1. 2. 3. 4. 5. 6. 7. 8. Open the Select Products procedure, ASP extension. Select the Page tab, and check the This is a Select Procedure box. Set PRO:ProductName as the column to hyperlink. Press the Column Assignments button, then Insert to add an assignment. Press the ellipsis button next to the Column to Fill From box. Click PRO:ProductID and press the Select button. Press the ellipsis button next to the Target Column box. Select the Other Tables node in the Tables pane of the Select Column dialog, press the Insert button, add the Order Details table, then select ORD2:ProductID field (the Order Details update will be the calling procedure). Press OK to return to the Column Assignments dialog.
9.
145
Press Insert to add another column to assign. This demonstrates how to call a lookup and return multiple values. We wish the lookup to fill in both the Product ID and the unit price. Press the ellipsis button next to the Column to Fill From box. Click PRO:Unit Price and press the Select button. Press the ellipsis button next to the Target Column box. Click on the Order Details table inserted in step 8, and then select ORD2:UnitPrice Press OK three times to close the dialogs and save the procedure changes.
11. 12. 13. 14. 15.
146
The Update Procedures

The UpdateCategories Procedure
This will be one of the four main entry points to the application, in that an HTML intro page will provide links to form/navigation procedures to Categories, Suppliers, Products and Orders, each starting at the first row. 1. 2. 3. Select the UpdateCategories procedure. Open the ASP extension. On the Actions tab, uncheck all actions except View. This will disallow anyone from adding a category.
147
4. 5.
Select the Custom Controls tab, and double click on the CAT:Picture field. Click on the Actions tab and press the Image button. The template extension automatically populates the image field to this tab, but you are responsible for setting the image source and type (there is no way for the template to determine the image type, i.e, .JPG or .GIF, so this will be done in the next step. Note also the field contents for all records for this binary field have been modified vs. the original Northwind database. In the sample database shipped with MS SQL Server, the binary images were stored as bitmaps. The custom file which you previously attached to the server contain exactly the same images, except stored in .GIF format, for display in browsers. Should you attempt to display the bitmap binary data in a browser, the ASP page would generate an error. In the Image dialog, choose Populate from Data Column. Specify CategoryID for the ID Value Column. The Table With Image box should already be filled with Categories. Set the ID column to Category ID. Choose Picture for the Image column. Choose .GIF for the image type.
6. 7. 8. 9. 10. 11.
148
12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23.
Press OK to close the Image dialog. Press OK to close the Controls dialog. Back on the Prompts for ASPForm dialog, Custom Controls tab, press the Insert button to insert another custom control. Name this one "ProductsLink" by typing that name in the Control name box. Set the control location to below, and the "populate from" to static text. Type "Products..." in the Enter Display Text box. This text will serve as a tool tip for the image we will specify in a later next step. Select the Actions tab. Specify this is a Procedure Link in the "Create this as a link" dropdown. Specify "Key value" in the "Pass this data" dropdown. Note that sometimes this exercise specifies passing a key, and at others, a column. Either is acceptable. Select Cat:Categories (which will be the category ID number) as the key to pass. Specify BrowseProducts as the procedure link. Specify List as the type of procedure.
149
24. 25. 26. 37.
Press the Image button. Select "Disk file" as the "Populate from" options. Type pointingfinger.gif in the file name box. Press the OK button three times to finish editing the procedure.
150
The UpdateCustomers Procedure
1. 2. 3. 4. 5. 6. 7. 8. 9.
Select the UpdateCustomers procedure. Open the ASP extension. On the Actions tab, uncheck the Delete box. This will disallow anyone from deleting a customer. Click on the Custom Controls tab and press Insert to add a new custom control. Type "Orders" as the control name. Type "View List of Orders for this Customer" for the Caption. Set the control location to "Below." Set the "Populate from" to "Static Text." Type "Orders..." as the display text.
151
10. 11. 12. 13. 14. 15.
Select the Actions tab. Choose "Procedure Link" in the "Create this as a link" dropdown. Choose "Data column" in the "Pass this data" dropdown. Choose CUS:CustomerID as the data column to pass. Choose "Browse Orders" as the procedure to link to. Set the type of procedure to "List" and press OK.
152
16.
On the Actions tab, check the Generate QBF box and specify the Browse Customers procedure as the parent browse. Optionally return to the Controls tab, and specify that non essential (in your opinion) fields not be included in the Query by Form by double clicking the field, and checking the Omit from QBF Page box. In general, query forms should have as few fields as possible, so as not to overwhelm the end user, and where possible, the fields should be key components or included in indices, for best performance.
Remember when populating a checkbox control on a query form that unchecked does not mean null (or no choice for that field). It means the query seeks records for which the value for that field is false. This concept could be confusing for many end users; therefore we recommend that when using Queries as a main navigation aid for your applications that you review the use of checkboxes. 17. Press OK to return to the application tree. Note: the Users Guide demonstrates embed code as an addition to this procedure, using embedded VBScript and adding custom controls to display the most recent order and the total value of all orders for the customer.
153
The UpdateEmployees Procedure
1. 2. 3. 4. 5. 6. 7.
Select the UpdateEmployees procedure. Open the window in this procedure. Locate the Photo field and delete it. It should be on the General tab. Close and save the Window. Open the ASP extension. On the Actions tab, uncheck the Delete box. This will disallow anyone from deleting a customer. Select the Custom Controls tab, and press the Insert button to insert a new control.
154 8.
CLARION/ASP Annotated Examples Type "Photo" in the control name field. Set the control location to above, and the "populate from" to static text. Leave the display text blank; the page will only display the picture. Select the Actions tab and press the Image button. Choose "Data column" from the populate from dropdown list. Select Emp:EmployeeID as the ID value column (the unique field for this table). Select Employees as the table with the image (this dialog allows you to display an image from another table as well as the one currently open). Select Emp:EmployeeID as the ID value column (the unique field for the table, the same one, with the image). Select Emp:Photo as the column with the image. Select jpg as the image type. IMPORTANT: this depends upon the use of the custom Northwind database supplied with Clarion/ASP.
9. 10. 11. 12. 13. 14. 15.
16. 17. 18. 19. 20.
Press OK twice to close the Image and Controls dialogs. Back in the Prompts for ASPForm dialog, click on the Controls tab. Double click the ReportsTo field to display the properties dialog. Click on the Validation tab. From the Procedure to Call drop box, select the SelectManagers procedure. Because this tab includes the Must be in File choice, it will automatically populate a lookup button which will call the procedure so that the end user can select a manager from a list. Press OK. Note that in other procedures we short circuited this behavior by substituting table loaded lists for selects, using the File Drop control template after deleting the entry field from the window structure.
155
On the Actions tab, check the Generate QBF box and specify the Browse Employees procedure as the parent browse. Optionally return to the Controls tab, and specify that all non essential fields should not be included in the Query by Form by double clicking the field, and checking the Omit from QBF Page box. Press OK to close the Controls dialogs and return to the Application tree.
22.
156
The UpdateOrders Procedure
1. 2. 3. 4. 5.
Select the UpdateOrders procedure. Open the window for this procedure. Select the CustomerID field and delete it. We will replace it with a control template so that the end user will see a table loaded list box. Select the EmployeeID field and delete it. We will also replace this with a control template so that the end user will see a table loaded list box. Select the Control Templates tool from the Tools palette, choose "File Drop." When the Select Column dialog appears, locate the new File Loaded Drop Box node, select the To Do node beneath it, press the Insert button, select the Customers table from the table list, then back in the Control Templates dialog, locate the Update Record on Disk node, select the Orders table which will be located as its subordinate node, then select the Orders CustomerID field from the right side of the dialog and press Select.
CLARION/ASP Orders Example 6. 7. The cursor should change to a cross hair. Click inside the window.
157
Locate the Customers table node under the File Drop box you added two steps ago, click it, then add the Customers CompanyName field to the list box, which should then be visible in the right hand pane. Press OK to return to the window. The List box formatter should now appear containing the CUS:Company Name column. Press OK. Right click on the newly placed drop down list control and choose Actions. Set the field to fill from to Cus:CustomerID, the target field to Ord:CustomerID (from the node under the Update Record on Disk node), press Select, and press OK to close the List Properties dialog.
8. 9.
10.
Select the Control Templates tool from the Tools palette, choose "File Drop." When the Select Column dialog appears, locate the new File Loaded Drop Box node, select the To Do node beneath it, press the Insert button, select the Employees table from the table list, then back in the Control Templates dialog, locate the Update Record on Disk node, select the Orders table which will be located as its subordinate node, then select the Orders EmployeeID field from the right side of the dialog and press Select. The cursor should change to a cross hair. Click inside the window. Locate the Employees table node under the File Drop box you added two steps ago, click it, then add the Employees Last_Name field to the list box, which should then be visible in the right hand pane. Press OK to return to the window.
11. 12.
158 13. 14.
CLARION/ASP Annotated Examples The List box formatter should now appear containing the Emp:Last_Name column. Press OK. Right click on the newly placed drop down list control and choose Actions. Set the field to fill from to Emp:EmployeeID, the target field to Ord:EmployeeID (from the node under the Update Record on Disk node), and press OK.
15. 16. 17. 18.
Close and save the window changes. Select the ASP form extension. Select the Custom Controls tab, and press the Insert button to insert a new control. Type "ViewOrderDetail" in the control name field. Set the control location to below, and the "populate from" to static text. Type "Order Details..." for the display text. Select the Actions tab.
19.
CLARION/ASP Orders Example 20. 21. 22. 23. 24. Select "Procedure Link" from the "Create this as a Link" dropdown. Choose "Key Value" in the "Pass this Data" dropdown. Choose "Ord:Order" as the key to pass. Select "Browseview_Order_Details_Extended" as the procedure link. Set the type of link to List.
159
25. 26. 27. 28.
Press the Image button. Choose "Disk file" from the populate from dropdown list. Type "editpencil.gif" as the image file name and press OK. On the Actions tab, verify that the Generate QBF box is checked and that the Browse Orders procedure is listed as the parent browse. Optionally return to the Controls tab, and specify that all non-essential fields should not be included in the Query by Form by double clicking the field, and checking the Omit from QBF Page box. Press OK to save the changes and return to the Application Tree.
29.
160
The UpdateOrder_Details Procedure
1 2. 3.
Open the UpdateOrderDetails procedure to the ASP extension. Select the Actions tab. Set the parent browse to BrowseView_Order_Details. Note: the strategy in this is as follows: where the information in a View is more user friendly than the DBMS table youre interested in updating, set the browse upon the view, and the update upon the table. When doing so, you must "connect back" from the form to the browse view, in the event that there are no records found for the form.
161
4. 5.
Select the Controls tab. Double click the OrderID field, then select the Validation tab. The client side validation should be set for Must be in File. Set the Select procedure to Select Orders from the dropdown list and press the OK button. Double click the ProductID field, then select the Validation tab. The client side validation should be set for Must be in File. Set the Select procedure to Select Products from the dropdown list and press the OK button. Save the procedure changes and return to the Application Tree.
6.
7.
162
The UpdateProducts Procedure
1. 2. 3. 4. 5.
Select the UpdateProducts procedure. Open the window for this procedure. Select the SupplierID field and delete it. We will replace it with a control template so that the end user will see a file loaded list box. Select the CategoryID field and delete it. We will also replace this with a control template so that the end user will see a file loaded list box. Select the Control Templates tool from the Tools palette, choose "File Drop." When the Select Column dialog appears, locate the new File Loaded Drop Box node, select the To Do node beneath it, press the Insert button, select the Suppliers table from the table list, then back in the Control Templates dialog, locate the Update Record on Disk node, select the Products table which will be located as its subordinate node, then select the Products SupplierID field from the right side of the dialog and press Select. The cursor should change to a cross hair. Click inside the window.
6.
163
Locate the Suppliers table node under the File Drop box you added two steps ago, click it, then add the Suppliers CompanyName field to the list box, which should then be visible in the right hand pane. Press OK to return to the window. The List box formatter should now appear containing the PRO:Company Name column. Press OK.
8.
9.
Right click on the newly placed drop down list control and choose Actions. Set the field to fill from to SUP:SupplierID, the target field to PRO:SupplierID (from the node under the Update Record on Disk node), and press OK. Back in the window, select the Control Templates tool from the Tools palette, choose "File Drop." When the Select Column dialog appears, locate the new File Loaded Drop Box node, select the To Do node beneath it, press the Insert button, select the Categories table from the table list, then back in the Control Templates dialog, locate the Update Record on Disk node, select the Products table which will be located as its subordinate node, then select the Products CategoryID field from the right side of the dialog and press Select. The cursor should change to a cross hair. Click inside the window.
10.
11.
164 12.
CLARION/ASP Annotated Examples Locate the Categories table node under the File Drop box you added two steps ago, click it, then add the CategoryName field to the list box, which should then be visible in the right hand pane. Press OK to return to the window.
13. 14.
The List box formatter should now appear containing the CAT:Category Name column. Press OK. Right click on the newly placed drop down list control and choose Actions. Set the field to fill from to CAT:CategoryID, the target field to PRO:CategoryID (from the node under the Update Record on Disk node), and press OK.
15.
Close and save the window changes.
CLARION/ASP Orders Example 16. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. 27. Open the ASP form extension. On the Actions tab, uncheck the Delete box. This will disallow anyone from deleting a product.
165
Click on the Custom Controls tab and press Insert to add a new custom control. Type "Photo" as the control name. Set the control location to "Above." Set the "Populate from" to "Static Text." Type "Orders..." as the display text. Select the Actions tab. Press the Image button. Choose "Populate from Data Column." Select PRO:ProductID for the ID value column. Click on the ellipsis button next to the table with image box. Select Products from the Update Record on Disk node, press Insert, and choose viewProductPhotos as the table with image (on the other tables tab; no relation was described in the dictionary). Note that in this case we're populating from a related table by providing a unique ID from this table. Select vpp:ProductID as the ID column (in the other table). Select vpp:Photo as the column containing the image. Set the Image type to jpg and press OK, and press OK again to close the Controls dialog.
28. 29. 30.
166 31.
CLARION/ASP Annotated Examples On the Actions tab, check the Generate QBF box and specify the Browse Products procedure as the parent browse. Optionally return to the Controls tab, and specify that all non essential fields should not be included in the Query by Form by double clicking the field, and checking the Omit from QBF Page box. Press OK to close the controls and extension dialogs and return to the Application Tree.
32.
The UpdateShippers Procedure
1. 2. 3. 4.
Select the UpdateShippers procedure. Open the ASP extension. On the Actions tab, uncheck all but the View box. This will disallow anyone from editing or adding a shipper. Press OK to close the dialog and return to the Application tree.
167
The UpdateSuppliers Procedure
1. 2. 3. 4. 5. 6. 7. 8.
Select the UpdateSuppliers procedure. Open the ASP extension. On the Actions tab, uncheck the Delete box. This will disallow anyone from deleting a supplier. Select the Custom Controls tab, and press the Insert button to insert a new control. Type "Products" in the control name field. Set the control location to below, and the "populate from" to static text. Type "View this Supplier's Products" in the "Text to display" box. Select the Actions tab. Choose "Custom Link" from the "Create this as link" dropdown list.
168 9. Type the following in the custom link box:
<a href='BrowseProductsNoRangeSelectList.asp?WHR=dbo.Suppliers.SupplierID=" & MID(TRIM(oRSSuppliers("SupplierID")),1,50) & "'><img src='IMAGES/pointingfinger.gif' alt='View This Suppliers Product List' border='0'></a>
This calls a copy of the Browse Products procedure (note: we haven't created that copy yet, but we will) with a custom WHERE clause. It fills the WHERE clause with the supplier ID from the current record, and displays a pointing finger graphic to signify the link.
10. 11. 12. 12. 13. 14. 15.
Press OK to close the Controls dialog. Back in the Prompts for ASPForm dialog, on the custom controls tab, press the Insert button to insert another custom control. Type "AddNewProduct" in the Control Name box. Type "Add a New Product for this Supplier" in the caption box. Choose "below" for the control location. Choose Populate from "static text." Type "Add a New Product for this Supplier" in the display text box.
CLARION/ASP Orders Example 16. 17. 18. 19. 20. Click the Actions tab. Select "Procedure Link" from the "Create this as a link" dropdown. Choose "Static entry" from the "Pass this data" dropdown. Type 0 in the static entry box; the Add procedure doesnt use ID1. Type the following in the Additional Parameters box:
169
Attention: the following code sample works only when the target is an entry box; but in this case, its a list box, therefore the following code will NOT work. Because we wish to show the right way for priming a field first, weve included this code at this point. In the following chapter, which contains instructions on editing the ASP files post-generation, we will provide instructions for correcting this case:
&txtProductsSupplierID=" & MID(TRIM(oRSSuppliers("SupplierID")),1,50) & "
This appends a parameter for the form field on the update products form, supplying the current supplier ID. Note the unmatched double quote at the end of the line; this is mandatory because the template provides its match. If just entering a string for the parameter, its not necessary.
170
21. 22. 23.
Choose "Update Products" from the Procedure Link dropdown. Choose Add as the type of procedure. Press OK twice to save the changes and return to the Application tree.
171
The ViewOrdersQuery Procedure
This update procedure acts upon a view in the database. We do not intend to actually update this view; only view it. This form is a good "jumping off point" for links to other procedures, and we will place five custom controls on it. Remember that just because you have a form doesnt mean you have to call the browse... and you can still call any thing else you want from it. And conversely, theres no harm in calling an update form for a view, if its in view only mode. 1. 2. 3. 4. Select the UpdateViewOrdersQuery procedure. Open the ASP extension. On the Actions tab, uncheck all but the View box. Select the Custom Controls tab, and press the Insert button to insert a new control.
172 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. Name the control name "Update." Type "Update Order" in the caption box. Set the control location to "above."
Choose "static text" for the "Populate from" option. Type "Update Order" in the "Text to display" box. Select the Actions tab. Create the link as a Procedure link. Specify a "key value" from the "Pass this data" dropdown. Choose VOQ:Order as the key to pass. Choose UpdateOrders from the Procedure Link dropdown. Set the Type of Procedure to Edit.
16. 17.
Press the Image button. Choose "Populate from disk file."
CLARION/ASP Orders Example 18. 19. Type order20x20.gif in the filename box.
173
Press OK to save the Custom Control, and press OK again to close the Controls dialog. Note these and other new images are provided in the project\asp\images directory. Back on the Prompts for ASPForm dialog, press the Insert button to insert another custom control. Name the control name "CustomerData." Type "View Customer Data" in the caption box. Set the control location to "above." Choose "static text" for the "Populate from" option. Type "View Customer Data" in the "Text to display" box. Select the Actions tab. Create the link as a Procedure link. Specify a "Data column" from the "Pass this data" dropdown. Choose VOQ:CustomerID as the key to pass. Choose UpdateCustomers from the Procedure Link dropdown. Set the Type of Procedure to View. Press the Image button. Choose "Populate from disk file." Type customer20x20.gif in the filename box. Press OK to save the Custom Control, and OK again to close the Controls dialog. Back on the Prompts for ASPForm dialog, press the Insert button to insert another custom control. Name the control name "EmployeeData." Type "View Employee Data" in the caption box. Set the control location to "above." Choose "static text" for the "Populate from" option.
20. 21. 22. 23. 24. 25. 26. 27. 28. 29. 30. 31. 32. 33. 34. 35. 36. 37. 38. 39. 40.
174 41. 42. 43. 44. 45. 46. 47. 48. 49. 50.
CLARION/ASP Annotated Examples Type "View Employee Data" in the "Text to display" box. Select the Actions tab. Create the link as a Procedure link. Specify a "Data column" from the "Pass this data" dropdown. Choose VOQ:EmployeeID as the key to pass. Choose UpdateEmployees from the Procedure Link dropdown. Set the Type of Procedure to View. Press the Image button. Choose "Populate from disk file." Type employee20x20.gif in the filename box.
51. 52. 53. 54. 55. 56. 57. 58. 59.
Press OK to save the Custom Control, and OK again to close the Controls dialog. Back on the Prompts for ASPForm dialog, press the Insert button to insert another custom control. Name the control name "ShipperData." Type "View Shipper Data" in the caption box. Set the control location to "above." Choose "static text" for the "Populate from" option. Type "View Shipper Data" in the "Text to display" box. Select the Actions tab. Create the link as a Procedure link.
CLARION/ASP Orders Example 60. 61. 62. 63. 64. 65. 66. 67. 68. 69. 70. 71. 72. 73. 74. 75. 76. 77. 78. 79. 80. 81. 82. 83. 84. Specify a "Data column" from the "Pass this data" dropdown. Choose VOQ:ShipVia as the key to pass. Choose UpdateShippers from the Procedure Link dropdown. Set the Type of Procedure to View. Press the Image button. Choose "Populate from disk file." Type shipper20x20.gif in the filename box.
175
Press OK to save the Custom Control, and OK again to close the Controls dialog. Back on the Prompts for ASPForm dialog, press the Insert button to insert another custom control. Name the control name "OtherOrders." Type "Other Orders for this Customer..." in the caption box. Set the control location to "above." Choose "static text" for the "Populate from" option. Type "Other Orders for this Customer..." in the "Text to display" box. Select the Actions tab. Create the link as a Procedure link. Specify a "Data column" from the "Pass this data" dropdown. Choose VOQ:CustomerID as the key to pass. Choose BrowseOrders from the Procedure Link dropdown. Set the Type of Procedure to List and the type to View. Press the Image button. Choose "Populate from disk file." Type order20x20.gif in the filename box. Press OK twice to save the Custom Control. Press OK to save the procedure changes and return to the Application Tree.
176
Range Limits and "Duplicate" Browses

We previously set up links to two not-yet existent procedures. A browse may either be range selected or not, and if range selected, it must be range selected to a single field. When its required that a browse sometimes be range selected and sometimes not, you must either set a custom ?WHR clause, or create two copies of the browse with different names, range selecting one, and not the other.
The BrowseOrders Procedure

1. 2. 3. 4. Select the BrowseOrders procedure in the Application Tree and open the ASP browse Extension. Select the Data Columns tab. Double click the Customer ID field. Select the "Range Limit on this Column" box on the General tab in the Data Columns dialog and press OK.
5. 6.
On the Page tab, press the Regenerate SQL button. Press OK to return to the Application Tree.
177
The BrowseProducts Procedure

1. 2. 3. 4. 5. 6. Select the BrowseProducts procedure in the Application Tree and open the ASP browse Extension. Select the Data Columns tab. Double click the Supplier ID field. Select the "Range Limit on this Column" box on the General tab in the Data Columns dialog. On the Page tab, press the Regenerate SQL button. Press OK to return to the Application Tree.
The BrowseView_Order_Details_Extended Procedure

1. 2. 3. 4. 5. 6. Select the BrowseView_Order_Details_Extended procedure in the Application Tree and open the ASP browse Extension. Select the Data Columns tab. Double click the Order ID field. Select the "Range Limit on this Column" box on the General tab in the Data Columns dialog and press OK. On the Page tab, press the Regenerate SQL button. Press OK to return to the Application Tree.
Copy the BrowseOrders Procedure

1. 2. 3. Select the BrowseOrders procedure in the Application Tree. From the development environment menu, choose Procedure > Copy. In the New Procedure dialog, name the new procedure BrowseOrdersNoRangeSelect.
178 4.
CLARION/ASP Annotated Examples In the Procedure Name Clash dialog, choose "Same." We wish the new procedure to perform exactly as the current one with only one exception. As the new procedure is created, several template symbol error messages will appear. Ignore them. Once the new procedure (BrowseOrdersNoRangeSelect) is added to the tree, select the BrowseOrdersNoRangeSelect procedure in the Application Tree and open the ASP browse Extension. Select the Data Columns tab. Double click the Customer ID field. Uncheck the "Range Limit on this Column" box on the General tab in the Data Columns dialog. Press OK to return to the browse extension dialog. On the Page tab, press the Regenerate SQL button. On the Default SQL tab, clear the Enter a Where clause to filter this list box. Note that Clarion/ASP never automatically clears this box because its possible that the developer has manually entered a WHERE clause. The Regenerate SQL button only affects the SQL Select and the ORDER BY boxes. Press OK to return to the Application Tree.
5.
6. 7. 8. 9. 10. 11.
12.
Copy the BrowseProducts Procedure

1. 2. 3. Select the BrowseProducts procedure in the Application Tree. From the development environment menu, choose Procedure > Copy. In the New Procedure dialog, name the new procedure BrowseProductsNoRangeSelect.
In the Procedure Name Clash dialog, choose "Same." We wish the new procedure to perform exactly as the current one with only one exception. As the new procedure is created, several template symbol error messages will appear. Ignore them.
179
Once the new procedure (BrowseProductsNoRangeSelect) is added to the tree, select the BrowseProductsNoRangeSelect procedure in the Application Tree and open the ASP browse Extension. Select the Data Columns tab. Double click the Supplier ID field. Uncheck the "Range Limit on this Column" box on the General tab in the Data Columns dialog and press OK. On the Page tab, press the Regenerate SQL button. On the Default SQL tab, clear the Enter a Where clause to filter this list box. Note that Clarion/ASP never automatically clears this box because its possible that the developer has manually entered a WHERE clause. The Regenerate SQL button only affects the SQL Select and the ORDER BY boxes. Press OK to return to the Application Tree.
6. 7. 8. 9. 10.
11.
At this point you should generate all the procedures, create your virtual directory, and run the index.htm page to test them.
180
7.
Customizing Generated Pages

This chapter provides examples of modifying the generated files. In this specific case, we have planned an application which opens onto four form navigations: Categories, Suppliers, Products, and Orders. From these four, the end user should be able to view data from related tables and views based on the linking fields. We wish for two of the opening form nav's, Categories and Orders, to display both the record for that table (or view in the latter case), plus the contents of a child browse (products for the former, order details for the latter). To do so, we edit the ASP generated files. Then, to display the additional data, we edit the HTML runtime templates. This provides the step-by-step instructions. As in all prior examples, we are assuming a root folder named Clarion6. Your root name may vary.
Categories Form with Products Browse (Filtered) Beneath
CLARION/ASP Customizing Generated Pages 1.
181
Open the Clarion6\examples\asp\orders\asp directory in Explorer and copy BrowseProductsList.asp to BrowseProductsList2.asp. Because youll be making changes to the ASP file, we want to have one regular browse, to display only the products, plus this other file, which well include below the categories form. Open BrowseProductsList2.asp in notepad and delete line one (<%@ Language=VBScript %>). This is an ASP statement which may only be included once within an ASP page. In the same file, delete the standard include files, starting at about line 20. Because the file including this one has the same includes, you dont want to include them twice: it would mean that the variable declarations would be repeated.
  
2.
3.
4. 5.
Do a search and replace: objCN --> objCN2. This declares a separate connection object for the browse. Search for the following string on line all by itself and delete it. Otherwise, it would be a duplicate declaration.
"DIM CategoriesCategoryName"
6.
Search for the string: Call MergeBrowseProductsListTemplate(HTML_Template) and replace it with: Call MergeBrowseProductsListTemplate("html/BrowseProductsList2.htm") This function originally calls this browse's complementary HTML runtime template, using a variable called HTML_template as a parameter. Change the name of that parameter to html/BrowseProductsList2.htm -- important -- note that youre adding double quotes! Instead of using a variable, youre using a string as the parameter. Youll be making a copy of the template shortly, so dont worry that the actual file doesnt exist yet.
7.
Search for the string test for any value in myWhere. Insert the following line before that:
mySQL = mySQL & WHERE dbo.Products.CategoryID= & myVar
Notes: in the steps below, youll define the myVar variable in another file; the variable will hold the CategoryID, which will filter this browse. 8. Save and close the BrowseProductsList2.asp file.
182 9.
CLARION/ASP Annotated Examples Open UpdateCategoriesView.asp with notepad. Search for DIM dbNavBarPrev, dbNavBarNext. It should be very close to the end of the file. Add the following code just before that line. Dont forget to substitute your table/column name should you be using this as a guide for changing an application of your own:
DIM myVar myVar = oRSCategories.Fields("CategoryID").Value
Notes: the code above declares a variable, and places the current CategoryID number into it. In the bottom part of the page, on the related browse, well use that variable to filter the browse. Because were joining the pages together, the other page will have access to the variable. 10. Approximately 20 lines below the lines you just inserted, youll find a line that starts with Call MergeUpdateCategoriesTemplate, with the runtime variable as a parameter. Now youll set the session variable. Insert the following lines immediately below the line with the Call to the merge procedure. And yes, the <% and %> are reversed, because you're splitting up an existing block and starting a new one! Youre instructing that the HTML generation process include the corresponding ASP page for the child browse. That must be done outside the ASP block, hence we split that block.
%>  <%
11.
Using Explorer, locate the \CLARION6\examples\asp\orders\asp\html\BrowseProductsList.htm file, and copy it to BrowseProductsList2.htm. Open BrowseProductsList2.htm, in an HTML editor or Notepad. Delete every line from the top of the file to the line that says <table CLASS="Data" CELLSPACING="1">. The reason for this is that youre including this file inside another file, and therefore you may not repeat the header information. Open the html/UpdateCategoriesView.htm file. Delete every line below the </form> tag, which will be close to the bottom of the file. This is the complementary step to the last step; this file now contains the beginning of the HTML file, whereas the previous file contained the end. In the same file, search and delete for any occurrences of the following strings: class = label; class = bg; class = data. Leave everything else on those lines as is. By doing this, you delete the style sheet formatting tags, which allow us to let the background image well later insert to show through the table.
12.
13.
14.
183
Note: this and the following step are just for appearance, and could be done in an HTML editor. In the same file, find this line: <td class="Input" >@CategoriesPicture@ </td> and delete the class= Input. Find this line: <td class="Input">@ProductsLink@ </td> and delete the class= Input on this line and the line below it. Back in the Clarion development environment, on the ASP extension, override and turn off HTML generation for UpdateCategories (that procedures Global tab, General subtab).
16. 17.
Youve now set the scene so that when calling the Update Categories View page, it in turn calls the Products browse page, and together they merge their output to their respective runtime templates, which you sewed together into what will appear to the end user as a single page.
184
ViewOrdersQuery Form with the view_Order_Details_Extended Browse
Note: Because the layout of the runtime template for the view orders query form is markedly changed, we've provided an edited file in the project directory. The HTML customizations are outside the scope of this manual. But there are some points worth considering: inserting a table within a table allows you to set up the indents in the areas such as customer address and shipping address; the button row on top is simply an extra row into which the custom control symbols were cut and pasted. 1. Copy Browseview_Order_Details_ExtendedList.asp to Browseview_Order_Details_ExtendedList2.asp. Just as in the previous example, we wish to allow the use of the browse by itself, not limiting it to use as an element in the form view. Open Browseview_Order_Details_ExtendedList2.asp in notepad and delete line one (<%@ Language=VBScript %>). This statement may only be present once within an ASP page.
2.
185
In the same file, delete the standard include files, starting at about line 20, which would otherwise be duplicated, resulting in duplicate variable declarations:
  
4.
Do a search and replace: objCN --> objCN2. This declares a separate connection object for the browse, preventing any clash with the connection object for the form. Search for the string "MergeBrowseview_Order_Details_ExtendedListTemplate". It will call this browse's complementary HTML runtime template, using a variable called HTML_template as a parameter. Change the name of that parameter to html/Browseview_Order_Details_ExtendedList2.htm -- important -- note that youre adding double quotes! Instead of using a variable, youre using a string as the parameter. Youll be making a copy of the template shortly, so dont worry that the actual file doesnt exist yet. This reflects the fact that it should merge with a copy of the runtime template. Search for the string & MyWhere. (Dont forget the ampersand when typing the search string). That line should currently start with: mySQL = . Change that line to the following (be careful with the white spaces):
mySQL = mySQL & WHERE dbo.[Order Details Extended].OrderID= & myVar
5.
6.
Notes: well set the myVar value to the OrderID in the steps below. The variable will hold the OrderID, which will filter this browse. 7. 8. Save and close the Browseview_Order_Details_ExtendedList2.asp file. Open UpdateViewOrdersQueryView.asp with notepad. Search for "DIM dbNavBarPrev, dbNavBarNext." It should be very close to the end of the file. Add the following code on the lines before that line. Don't forget to substitute your table/column name should you be using this as a guide for changing an application of your own:
DIM myVar myVar = oRSviewOrdersQuery.Fields("OrderID").Value
Notes: the code above declares a variable, and places the current order number into it. In the next step, well use the OrderID in a custom WHERE clause for the browse well append to the bottom of this form, which we stored in the myVar variable.
186 9.
CLARION/ASP Annotated Examples Approximately 20 lines below the lines you just inserted, youll find a that starts with Call MergeUpdateViewOrdersQueryTemplate, with the HTML_Template variable as a parameter. Now youll set the session variable. Insert the following lines immediately below the line with the Call to the merge procedure. And yes, the <% and %> are reversed, because you're splitting up an existing block and starting a new one! Youre instructing that the HTML generation process include the corresponding ASP page for the child browse. That must be done outside the ASP block, hence we split that block.
%>   
Global Overrides
The next block allows you to remove comments and override any of the global options by setting them to True or False.
<% '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' %> DebugMode is defined in AppData.asp as FALSE by default debug of this page only by uncommenting the next line DebugMode = [FALSE, TRUE] ShowQuery is defined in AppData.asp from the Application level query of this page can be overridden by uncommenting the next line ShowQuery = [FALSE, TRUE] ShowDBNav is defined in AppData.asp from the Application level display of the nav bar can be overridden by uncommenting the next line ShowDBNav = [FALSE, TRUE] RecordsPerPage is defined in AppData.asp from the Application level display of the number of records can be overridden by uncommenting the next line RecordsPerPage = ##
194
Variable Declarations
The next block declares all the variables necessary for this page. Note that many of them describe options for the data from each individual field, which will be sent to the runtime template by the merge function. Then, at the end of the block, the recordset is declared (oRSProducts), plus string variables which will hold the SELECT statement, clause by clause. It also declares the ADO connection object (objCN), sets timeout options for the application, and opens the application. The final line calls the CheckError function, which will check the errors object after each database access, and if an error is found, reports it.
<% DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM DIM HeaderText, TemplateText, DataRowEmptyText, DataRowFilledText, FooterText RemainderText, BrowseProductsRowData, ndxStart, ndxEnd, strLEN Seq, MaxPages, TotalRecords, iStart, iEnd, TableFooter, ref, counter PageIndex, RecordsPageSize ProductsAutomaticDetailLink ProductsAutomaticDetailLinkSTYLE ProductsProductNameLABEL ProductsProductName ProductsProductNameSTYLE ProductsProductIDLABEL ProductsProductID ProductsProductIDSTYLE ProductsSupplierIDLABEL ProductsSupplierID ProductsSupplierIDSTYLE ProductsCategoryIDLABEL ProductsCategoryID ProductsCategoryIDSTYLE ProductsQuantityPerUnitLABEL ProductsQuantityPerUnit ProductsQuantityPerUnitSTYLE ProductsUnitPriceLABEL ProductsUnitPrice ProductsUnitPriceSTYLE ProductsUnitsInStockLABEL ProductsUnitsInStock ProductsUnitsInStockSTYLE ProductsUnitsOnOrderLABEL ProductsUnitsOnOrder ProductsUnitsOnOrderSTYLE ProductsReorderLevelLABEL ProductsReorderLevel ProductsReorderLevelSTYLE
DIM oRSProducts, mySQL, myWhere, myQuery, myPage, valSQL '' create the connection object Dim objCN Set objCN = Server.CreateObject("ADODB.Connection") objCN.ConnectionTimeout = Application("MyASP_ConnectionTimeOut") objCN.CommandTimeout = Application("MyASP_CommandTimeOut") objCN.CursorLocation = Application("MyASP_CursorLocation")

objCN.Open Application("MyASP_ConnectionString"), Application("MyASP_RuntimeUserName"), Application("MyASP_RuntimePassword") CheckError %>
195
Debug Information
The next block outputs as much information about the page as possible if the application is in debug mode. The Response.Write function outputs a string or variable to the page to be displayed in the browser. The session variables will have been loaded with options from any previous page, such as column sorts and where parameters supplied in a URL.
<% IF DebugMode THEN %>  <% END IF ' of DebugMode block %>
196
Prepare RecordSet and Session Variables

The next block is a long one and will be described in smaller sections. The first section initializes the record set. It then clears the session variables if it finds that the page was called without parameters, either from a URL parameter, or from a previous page, including any column sorts (in which case the previous page was itself).
<% SET oRSProducts = Server.CreateObject("ADODB.Recordset")IF Request.QueryString("RESETLIST") = "TRUE" THEN myWhere = "" SESSION("BrowseProducts#WHR") = checkNull(SESSION("BrowseProducts#RANGE")) SESSION("BrowseProducts#COL") = "" SESSION("BrowseProducts#SRT") = "" SESSION("BrowseProducts#PreviousColumn") = "" SESSION("BrowseProducts#PreviousSort") = "" SESSION("BrowseProducts#mySort") = "" SESSION("BrowseProducts#myOrder") = "" END IF IF Request.QueryString = "" THEN IF (Instr(1,LCase(REQUEST.ServerVariables("HTTP_REFERER")),"search.asp")= 0) THEN myWhere = "" SESSION("BrowseProducts#WHR") = checkNull(SESSION("BrowseProducts#RANGE")) SESSION("BrowseProducts#COL") = "" SESSION("BrowseProducts#SRT") = "" SESSION("BrowseProducts#PreviousColumn") = "" SESSION("BrowseProducts#PreviousSort") = "" SESSION("BrowseProducts#mySort") = "" SESSION("BrowseProducts#myOrder") = "" END IF END IF IF Request.QueryString("ID1") = "" THEN IF (Instr(1,LCase(REQUEST.ServerVariables("HTTP_REFERER")),"search.asp") = 0 ) THEN IF (Instr(1,LCase(REQUEST.ServerVariables("HTTP_REFERER")), REQUEST.ServerVariables("URL")) > 0 ) THEN IF Request("LOCATE") <> "TRUE" THEN myWhere = "" IF checkNull(SESSION("BrowseProducts#RANGE")) > "" THEN SESSION("BrowseProducts#WHR") = checkNull(SESSION("BrowseProducts#RANGE")) END IF END IF END IF END IF END IF
197
Column Sorts
If the page has been given a column to sort on as a parameter, then it prepares the session variable which signal what the sort should be, including placing the Order By clause in a session variable. Remember that in this example, we did not disable the sorting option for any columns, so theres quite a bit of code here for enabling sorting on fields that probably wouldnt be sorted on in a real world application.
'' set the url for the column links myPage = Request.ServerVariables("URL") IF(REQUEST("COL") <> "") THEN SESSION("BrowseProducts#PreviousColumn") = REQUEST("COL") ELSE SESSION("BrowseProducts#PreviousColumn") = "" END IF IF(REQUEST("SRT") <> "") THEN SESSION("BrowseProducts#PreviousSort") = REQUEST("SRT") ELSE SESSION("BrowseProducts#PreviousSort") = "" END IF IF ( IsEmpty(SESSION("BrowseProducts#COL")) OR IsNull(SESSION("BrowseProducts#COL")) ) THEN IF(Request.QueryString("COL")="" AND SESSION("BrowseProducts#COL") = "") THEN SESSION("BrowseProducts#COL") = "ProductName" END IF END IF IF Request("COL") = "ProductName" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder")="ORDER BY dbo.Products.ProductName DESC" SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ProductName ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ProductName ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "ProductName" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "ProductID" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ProductID DESC" SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ProductID ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ProductID ASC" SESSION("BrowseProducts#mySort") = "ASC"
198

END IF SESSION("BrowseProducts#COL") = "ProductID" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "SupplierID" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.SupplierID DESC" SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.SupplierID ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.SupplierID ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "SupplierID" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "CategoryID" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.CategoryID DESC" SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.CategoryID ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.CategoryID ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "CategoryID" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "QuantityPerUnit" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.QuantityPerUnit DESC" SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.QuantityPerUnit ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.QuantityPerUnit ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "QuantityPerUnit" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "UnitPrice" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitPrice DESC" SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitPrice ASC" SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitPrice ASC"

SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "UnitPrice" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "UnitsInStock" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitsInStock SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitsInStock SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitsInStock SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "UnitsInStock" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "UnitsOnOrder" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitsOnOrder SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitsOnOrder SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.UnitsOnOrder SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "UnitsOnOrder" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF Request("COL") = "ReorderLevel" THEN IF Request("SRT") = "DESC" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ReorderLevel SESSION("BrowseProducts#mySort") = "DESC" ELSE SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ReorderLevel SESSION("BrowseProducts#mySort") = "ASC" END IF IF ( Request("COL") <> SESSION("BrowseProducts#PreviousColumn") ) THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ReorderLevel SESSION("BrowseProducts#mySort") = "ASC" END IF SESSION("BrowseProducts#COL") = "ReorderLevel" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF '' this block sets the default column and sort IF ( IsEmpty(SESSION("BrowseProducts#COL")) OR IsNull(SESSION("BrowseProducts#COL")) ) THEN IF (Request.QueryString("COL") = "" AND SESSION("BrowseProducts#COL") = SESSION("BrowseProducts#COL") = "ProductName" SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ProductName SESSION("BrowseProducts#mySort") = "ASC" END IF END IF
199
DESC"
ASC"
ASC"
DESC"
ASC"
ASC"
DESC"
ASC"
ASC"
"") THEN ASC"
200
The Base SELECT Statement

This next section sets the base (i.e., without any WHERE or ORDER by clauses) for the SQL SELECT statement. Afterwards, the code will test for those clauses, and append anything applicable to the myQuery variable:
'' Set The SQL Statement From The Browse Template myQuery = "SELECT dbo.Products.ProductID, dbo.Products.ProductName, dbo.Products.SupplierID, dbo.Products.CategoryID, dbo.Products.QuantityPerUnit, dbo.Products.UnitPrice, dbo.Products.UnitsInStock, dbo.Products.UnitsOnOrder, dbo.Products.ReorderLevel FROM dbo.Products"
Appending WHERE and ORDER BY Clauses

The next section begins by testing for a WHERE clause. This may come from a URL (as a ?WHR parameter), or from a session variable (as stored by a locator or from if there had been a range select option on the browse).
'' test for a WHR parameter, URL or SESSION IF LEN(Request.QueryString("WHR")) THEN myWhere = Request("WHR") SESSION("BrowseProducts#WHR") = Request("WHR") ELSEIF LEN(SESSION("BrowseProducts#WHR")) THEN myWhere = SESSION("BrowseProducts#WHR") END IF
Checking for Reset or Locate Flags

Next, the code checks for a ?RESETLIST parameter. This flag is true if an end user had clicked on an All Data link to clear a filter after implementing a locator. If it finds it, it clears any WHERE clause (which would have been stored in the myWhere variable. Then it checks for a ?LOCATE parameter, which indicates that a locator control was activated, and therefore a LIKE % must be added to the WHERE clause.
IF Request.QueryString("RESETLIST") = "TRUE" THEN myWhere = "" SESSION("BrowseProducts#WHR") = "" END IF IF myWhere = "" THEN IF Request("LOCATE") = "TRUE" THEN myWhere = Request("FIELD") & " LIKE " & CHR(39) & Request("SearchValue") & "%" & CHR(39) SESSION("BrowseProducts#WHR") = myWhere END IF ELSE IF Request("LOCATE") = "TRUE" THEN myWhere = myWhere & " AND " myWhere = myWhere & Request("FIELD") & " LIKE " & CHR(39) & Request("SearchValue") & "%" & CHR(39) SESSION("BrowseProducts#WHR") = myWhere END IF END IF
201
Building the WHERE Clause

The code then gathers the next items necessary for the WHERE clause, concatenates it and continues building the SQL SELECT statement (fieldlist, FROM clause and WHERE clause) using the mySQL variable which it had filled before.
'' test for any value in the myWhere, if valid concatenate the clause IF myWHERE <> "" THEN mySQL = mySQL & " WHERE " & myWhere END IF
Finishing the WHERE Clause

The following section checks the session variables for any ORDER BY clause and appends it to the SELECT statement:
IF SESSION("BrowseProducts#myOrder") = "" THEN SESSION("BrowseProducts#myOrder") = "ORDER BY dbo.Products.ProductName ASC" SESSION("BrowseProducts#mySort") = "ASC" SESSION("BrowseProducts#COL") = "ProductName" SESSION("BrowseProducts#SRT") = SESSION("BrowseProducts#mySort") END IF IF SESSION("BrowseProducts#myOrder") <> "" THEN mySQL = mySQL & " " & SESSION("BrowseProducts#myOrder") END IF
Open the RecordSet

The code then opens up the record set, which is called oRSProducts, using the Open method, specifying the cursor and isolation types, and then calls the check error routine.
oRSProducts.Open mySQL , objCN, CheckError adOpenStatic, adLockReadOnly
If the ?RESETLIST parameter is true, it cleans out the WHERE clause:

IF Request.QueryString("RESETLIST") = "TRUE" THEN myWhere = "" SESSION("BrowseProducts#WHR") = checkNull(SESSION("BrowseProducts#RANGE")) END IF %>
202
More Debug Information

The next block provides additional debug information, now that the record set is open:
<% IF DebugMode THEN %>  <% END IF ' of DebugMode block %>
Finish Up and Output

The next block is the remainder of the ASP code for the page (the functions, similar to ROUTINEs follow, and are commented below). First, the code calculates the how many pages there will be, so that it can provide a page # of # label for the navigation bar. it then calls the Merge routine (Call MergeBrowseProductsListTemplate), explained further down, which is something like a mail merge: all the data meant to display on the page is output in its proper place, according to where its symbol resides in the HTML runtime template. If there are no records, then a no records message is output. If in debug mode, further debug information is output. It then closes the connection object, since it has all the data.
<% RecordsPageSize = RecordsPerPage PageIndex = Request("PageIndex") IF PageIndex = "" THEN PageIndex = 1 END IF IF (oRSProducts.State = 1) THEN IF( (NOT oRSProducts.BOF = TRUE) AND (NOT oRSProducts.EOF = TRUE) ) THEN IF oRSProducts.RecordCount > 0 THEN oRSProducts.PageSize = RecordsPageSize 'Total Number of records to show oRSProducts.AbsolutePosition = 1 'To stat showing record in page size oRSProducts.AbsolutePage = PageIndex 'To go on group number made by page size MaxPages = oRSProducts.PageCount
203
TotalRecords = oRSProducts.RecordCount SearchField = "" SearchMessage = "" IF SESSION("BrowseProducts#WHR") <> "" THEN IF NOT(REQUEST.QUERYSTRING("RESETLIST")=TRUE) THEN IF REQUEST("ID1") > "" THEN SearchMessage = "<A href='BrowseProducts" & "List.asp?ID1=" & REQUEST("ID1") ELSE SearchMessage = "<A href='BrowseProducts" & "List.asp" END IF IF REQUEST("RNG") > "" THEN IF (Instr(1,UCASE((SearchMessage)),"RNG",1)=0) THEN IF (SearchMessage > "") THEN SearchMessage = SearchMessage & "&RNG=" & REQUEST("RNG") ELSE SearchMessage = "<A href='BrowseProducts" & "List.asp?RNG=" & REQUEST("RNG") END IF END IF END IF IF (Instr(1,SearchMessage,"?",1) = 0 ) THEN SearchMessage = SearchMessage & "?RESETLIST=TRUE'>All data</A>" ELSE SearchMessage = SearchMessage & "&RESETLIST=TRUE'>All data</A>" END IF END IF ELSE SearchMessage = "" END IF Call MergeBrowseProductsListTemplate(HTML_Template) ELSE Call NoRecordsFound() END IF ELSE Call NoRecordsFound() END IF ELSE Call NoRecordsFound() END IF IF DebugMode THEN Response.Write("QueryString: " & Request.QueryString) END IF set oRSProducts = Nothing '' close and destroy the connection object objCN.Close SET objCN = NOTHING
204
Function: NoRecordsFound
The functions now follow. The first, NoRecordsFound simply outputs a message saying that the SELECT statement didnt return any rows of data:
'=======================================================================' FUNCTION NoRecordsFound '=======================================================================' Set FileObject = Server.CreateObject("Scripting.FileSystemObject") TemplateText = Server.MapPath("HTML/blank.htm") Set InStream = FileObject.OpenTextFile (TemplateText, 1, False, False) TemplateText = Empty While not InStream.AtEndOfStream TemplateText = TemplateText & InStream.ReadLine & vbcrlf Wend Set Instream = Nothing TemplateText = Replace(TemplateText,"@ClarionData@","<A HREF='JAVASCRIPT:history.back();'>No records were found</A>") Response.Write(TemplateText) Set FileObject = Nothing END FUNCTION '----------------------------------------------------------------------'
Function:MergeBrowseProductsListTemplate
The next function, MergeBrowseProductsListTemplate, is the heart of the display process. It creates a file system object in order to open the runtime HTML template. It reads it, and calls additional functions as necessary in order to output the HTML it finds in the template, subsituting column names, data, and footer from the variables its assembled previously:
'======================================================================' Function MergeBrowseProductsListTemplate(templatepath) ' Merge Runtime HTML Template Function ' '======================================================================' If(templatepath = "") then templatepath = "HTML/BrowseProductsList.htm" End If Set FileObject = Server.CreateObject("Scripting.FileSystemObject") TemplateText = Server.MapPath(templatepath) Set InStream = FileObject.OpenTextFile (TemplateText, 1, False, False) TemplateText = Empty While not InStream.AtEndOfStream TemplateText = TemplateText & InStream.ReadLine & vbcrlf Wend Set Instream = Nothing '' resolve any includes TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude(""))
205
TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) '' start iterating the symbols and assigning the values TemplateText = Replace(TemplateText,"@SearchField@", SearchField) TemplateText = Replace(TemplateText,"@SearchMessage@", SearchMessage) HeaderText = Empty HeaderText = Mid(TemplateText,1, (Instr(1,UCASE(TemplateText),"",1) -1)) Call buildColumnLabels '' get the default data row text ndxStart = (Instr(1,UCASE(TemplateText),"",1) +20) ndxEnd = (Instr(1,UCASE(TemplateText),"",1) -1) strLEN = (ndxEnd - ndxStart) DataRowFilledText = Empty DataRowEmptyText = Empty DataRowEmptyText = Mid(TemplateText, ndxStart, strLen ) Call buildDataRows '' get the footer text ndxStart = (Instr(1,UCASE(TemplateText),"",1) +19) ndxEnd = (Instr(1,UCASE(TemplateText),"",1) -1) strLEN = (ndxEnd - ndxStart) FooterText = Empty FooterText = Mid(TemplateText, ndxStart, strLen ) call buildFooter '' remainder of page ndxStart = (Instr(1,UCASE(TemplateText),"",1) +17) ndxEnd = (Instr(1,UCASE(TemplateText),"</HTML>",1) +7) strLEN = (ndxEnd - ndxStart) RemainderText = Empty RemainderText = Mid(TemplateText, ndxStart, strLen) TemplateText = Empty IF varType(HeaderText) > 1 THEN TemplateText = HeaderText END IF IF varType(DataRowFilledText) > 1 THEN TemplateText = TemplateText & DataRowFilledText END IF IF varType(FooterText) > 1 THEN TemplateText = TemplateText & FooterText END IF IF varType(RemainderText) > 1 THEN TemplateText = TemplateText & RemainderText END IF TemplateText = Replace(TemplateText,"@TableFooter@", FooterText) Response.Write(TemplateText) END Function '----------------------------------------------------------------------'
206
Function: buildColumnLabels
The next function is long, but does only one thing: build the column labels. The column labels have to be links, so that the end user can click on them to do the sorting. Additionally, if the column is the current sort, it has to display the proper icon to indicate its the sorted column, and the direction of the sort. Note that it determines if its the sorted column by checking the session variable. It also places a Class tag to indicate the Cascading Style Sheet style for each cell.
'======================================================================' FUNCTION buildColumnLabels ' buildColumnLabels Function ' '=======================================================================' myLink = "<a href='" & myPage & "?" myLink = myLink & "COL=ProductName" IF ( SESSION("BrowseProducts#PreviousColumn") = "ProductName") THEN IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE IF( SESSION("BrowseProducts#COL") = "ProductName" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1") END IF myLink = myLink & "'>Product Name</a>" ProductNameLABEL = myLink IF (Request("COL") = "ProductName") OR (SESSION("BrowseProducts#COL") = "ProductName") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN ProductNameLABEL = ProductNameLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE ProductNameLABEL = ProductNameLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %>  <% END IF %> <% myLink = "<a href='" & myPage & "?" myLink = myLink & "COL=CategoryName" IF ( SESSION("BrowseProducts#PreviousColumn") = "CategoryName") THEN

IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE
207
IF( SESSION("BrowseProducts#COL") = "CategoryName" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1") END IF myLink = myLink & "'>Category</a>" CategoryNameLABEL = myLink IF (Request("COL") = "CategoryName") OR (SESSION("BrowseProducts#COL") = "CategoryName") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN CategoryNameLABEL = CategoryNameLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE CategoryNameLABEL = CategoryNameLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %>  <% END IF %> <% myLink = "<a href='" & myPage & "?" myLink = myLink & "COL=CompanyName" IF ( SESSION("BrowseProducts#PreviousColumn") = "CompanyName") THEN IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE IF( SESSION("BrowseProducts#COL") = "CompanyName" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1") END IF myLink = myLink & "'>Company</a>" CompanyNameLABEL = myLink
208

IF (Request("COL") = "CompanyName") OR (SESSION("BrowseProducts#COL") = "CompanyName") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN CompanyNameLABEL = CompanyNameLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE CompanyNameLABEL = CompanyNameLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %>  <% END IF %> <% myLink = "<a href='" & myPage & "?" myLink = myLink & "COL=QuantityPerUnit" IF ( SESSION("BrowseProducts#PreviousColumn") = "QuantityPerUnit") THEN IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE IF( SESSION("BrowseProducts#COL") = "QuantityPerUnit" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1") END IF myLink = myLink & "'>Quantity Per Unit</a>" QuantityPerUnitLABEL = myLink IF (Request("COL") = "QuantityPerUnit") OR (SESSION("BrowseProducts#COL") = "QuantityPerUnit") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN QuantityPerUnitLABEL = QuantityPerUnitLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE QuantityPerUnitLABEL = QuantityPerUnitLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %>  <% END IF %>

<%
209
myLink = "<a href='" & myPage & "?" myLink = myLink & "COL=UnitPrice" IF ( SESSION("BrowseProducts#PreviousColumn") = "UnitPrice") THEN IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE IF( SESSION("BrowseProducts#COL") = "UnitPrice" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1") END IF myLink = myLink & "'>Unit Price</a>" UnitPriceLABEL = myLink IF (Request("COL") = "UnitPrice") OR (SESSION("BrowseProducts#COL") = "UnitPrice") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN UnitPriceLABEL = UnitPriceLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE UnitPriceLABEL = UnitPriceLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %>  <% END IF %> <% myLink = "<a href='" & myPage & "?" myLink = myLink & "COL=UnitsInStock" IF ( SESSION("BrowseProducts#PreviousColumn") = "UnitsInStock") THEN IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE IF( SESSION("BrowseProducts#COL") = "UnitsInStock" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1")
210

END IF myLink = myLink & "'>Units In Stock</a>" UnitsInStockLABEL = myLink IF (Request("COL") = "UnitsInStock") OR (SESSION("BrowseProducts#COL") = "UnitsInStock") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN UnitsInStockLABEL = UnitsInStockLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE UnitsInStockLABEL = UnitsInStockLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %>  <% END IF %> <% myLink = "<a href='" & myPage & "?" myLink = myLink & "COL=UnitsOnOrder" IF ( SESSION("BrowseProducts#PreviousColumn") = "UnitsOnOrder") THEN IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE IF( SESSION("BrowseProducts#COL") = "UnitsOnOrder" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1") END IF myLink = myLink & "'>Units On Order</a>" UnitsOnOrderLABEL = myLink IF (Request("COL") = "UnitsOnOrder") OR (SESSION("BrowseProducts#COL") = "UnitsOnOrder") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN UnitsOnOrderLABEL = UnitsOnOrderLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE UnitsOnOrderLABEL = UnitsOnOrderLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %> 
211
= "<a href='" & myPage & "?" = myLink & "COL=ReorderLevel" ( SESSION("BrowseProducts#PreviousColumn") = "ReorderLevel") THEN IF Request("SRT") = "ASC" THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF ELSE IF( SESSION("BrowseProducts#COL") = "ReorderLevel" AND SESSION("BrowseProducts#mySORT") = "ASC") THEN myLink = myLink & "&SRT=DESC" ELSE myLink = myLink & "&SRT=ASC" END IF END IF IF Request.QueryString("ID1") <> "" THEN myLink = myLink & "&ID1=" & Request.QueryString("ID1") END IF myLink = myLink & "'>Reorder Level</a>" ReorderLevelLABEL = myLink IF (Request("COL") = "ReorderLevel") OR (SESSION("BrowseProducts#COL") = "ReorderLevel") THEN IF (Request("SRT") = "ASC") OR (SESSION("BrowseProducts#SRT") = "ASC") OR (SESSION("BrowseProducts#mySORT") = "ASC") THEN ReorderLevelLABEL = ReorderLevelLABEL & "<img alt='ASC' SRC=" & IconAsc & " border=" & IconBorder & " height=14 width=16>" ELSE ReorderLevelLABEL = ReorderLevelLABEL & "<img alt='DESC' SRC=" & IconDesc & " border=" & IconBorder & " height=14 width=16>" END IF END IF %> <%IF DebugMode THEN %>  <% END IF %> <% HeaderText = Replace(HeaderText,"@ProductNameLABEL@", ProductNameLABEL) HeaderText = Replace(HeaderText,"@CategoryNameLABEL@", CategoryNameLABEL) HeaderText = Replace(HeaderText,"@CompanyNameLABEL@", CompanyNameLABEL) HeaderText = Replace(HeaderText,"@QuantityPerUnitLABEL@", QuantityPerUnitLABEL) HeaderText = Replace(HeaderText,"@UnitPriceLABEL@", UnitPriceLABEL) HeaderText = Replace(HeaderText,"@UnitsInStockLABEL@", UnitsInStockLABEL) HeaderText = Replace(HeaderText,"@UnitsOnOrderLABEL@", UnitsOnOrderLABEL) HeaderText = Replace(HeaderText,"@ReorderLevelLABEL@", ReorderLevelLABEL) END FUNCTION
212
Function: buildDataRows
The next function takes the data from the data set, places it in the proper variables, and loops through however many rows it takes to assemble the HTML table with data. If any of the cells contain links, whether an automatic link to an edit form, or a link to a separate procedure, it has to include the link tag.
'=======================================================================' FUNCTION buildDataRows ' buildDataRows Function ' '=======================================================================' Seq = 1 DO WHILE NOT oRSProducts.eof AND Seq <= RecordsPageSize DataRowFilledText = DataRowFilledtext & DataRowEmptyText Style = "MyDataRow" ProductsAutomaticDetailLinkSTYLE = "TableRow" & style myLink = "" ''procedure link myLink = "<a href='UpdateProductsView.asp?ID1=" ProductsAutomaticDetailLink = myLink ProductsAutomaticDetailLink = ProductsAutomaticDetailLink & Server.URLEncode(TRIM(Cstr(oRSProducts.Fields("ProductID").Value))) IF (Instr(1,UCASE((ProductsAutomaticDetailLink)),"RNG",1)=0) THEN IF REQUEST("RNG") > "" THEN ProductsAutomaticDetailLink = ProductsAutomaticDetailLink & "&RNG=" & Server.URLEncode(REQUEST("RNG")) ELSE IF REQUEST("ID1") > "" THEN ProductsAutomaticDetailLink = ProductsAutomaticDetailLink & "&RNG=" & Server.URLEncode(REQUEST("ID1")) END IF END IF END IF ''procedure link DIM tmpIMG_ProductsAutomaticDetailLink tmpIMG_ProductsAutomaticDetailLink = "<img src='/images/Editpencil.Gif' border='0' alt=''>" ProductsAutomaticDetailLink = ProductsAutomaticDetailLink & "'>" & tmpIMG_ProductsAutomaticDetailLink & "</a>" ''after static link Style = "MyDataRow" ProductsProductNameSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("ProductName").Value) THEN ProductsProductName = "" ELSE ProductsProductName = oRSProducts.Fields("ProductName").Value END IF Style = "MyDataRow" CategoriesCategoryNameSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("CategoryName").Value) THEN CategoriesCategoryName = "" ELSE myLink = "<a href=UpdateCategoriesView.asp?ID1="
213
CategoriesCategoryName = myLink & Server.URLEncode(TRIM(Cstr(oRSProducts.Fields("CategoryID").Value))) & Server.URLEncode("") & ">" & MID(TRIM(oRSProducts.Fields("CategoryName").Value),1,50) & "</a>" END IF Style = "MyDataRow" SuppliersCompanyNameSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("CompanyName").Value) THEN SuppliersCompanyName = "" ELSE myLink = "<a href=UpdateSuppliersView.asp?ID1=" SuppliersCompanyName = myLink & Server.URLEncode(TRIM(Cstr(oRSProducts.Fields("SupplierID").Value))) & Server.URLEncode("") & ">" & MID(TRIM(oRSProducts.Fields("CompanyName").Value),1,50) & "</a>" END IF Style = "MyDataRow" ProductsQuantityPerUnitSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("QuantityPerUnit").Value) THEN ProductsQuantityPerUnit = "" ELSE ProductsQuantityPerUnit = oRSProducts.Fields("QuantityPerUnit").Value END IF Style = "MyDataRow" ProductsUnitPriceSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("UnitPrice").Value) THEN ProductsUnitPrice = "" ELSE ProductsUnitPrice = FormatCurrency(oRSProducts.Fields("UnitPrice").Value,2,-2,-2,2) END IF Style = "MyDataRow" ProductsUnitsInStockSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("UnitsInStock").Value) THEN ProductsUnitsInStock = "" ELSE ProductsUnitsInStock = oRSProducts.Fields("UnitsInStock").Value END IF Style = "MyDataRow" ProductsUnitsOnOrderSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("UnitsOnOrder").Value) THEN ProductsUnitsOnOrder = "" ELSE ProductsUnitsOnOrder = oRSProducts.Fields("UnitsOnOrder").Value END IF Style = "MyDataRow" ProductsReorderLevelSTYLE = "TableRow" & Style IF ISNULL(oRSProducts.Fields("ReorderLevel").Value) THEN ProductsReorderLevel = "" ELSE ProductsReorderLevel = oRSProducts.Fields("ReorderLevel").Value END IF Seq = Seq + 1 oRSProducts.MoveNext CheckError DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsAutomaticDetailLink@", ProductsAutomaticDetailLink)
214

DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsAutomaticDetailLinkSTYLE@", ProductsAutomaticDetailLinkSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsProductName@", ProductsProductName) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsProductNameSTYLE@", ProductsProductNameSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@CategoriesCategoryName@", CategoriesCategoryName) DataRowFilledtext = Replace(DataRowFilledtext,"@CategoriesCategoryNameSTYLE@", CategoriesCategoryNameSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@SuppliersCompanyName@", SuppliersCompanyName) DataRowFilledtext = Replace(DataRowFilledtext,"@SuppliersCompanyNameSTYLE@", SuppliersCompanyNameSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsQuantityPerUnit@", ProductsQuantityPerUnit) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsQuantityPerUnitSTYLE@", ProductsQuantityPerUnitSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitPrice@", ProductsUnitPrice) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitPriceSTYLE@", ProductsUnitPriceSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsInStock@", ProductsUnitsInStock) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsInStockSTYLE@", ProductsUnitsInStockSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsOnOrder@", ProductsUnitsOnOrder) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsOnOrderSTYLE@", ProductsUnitsOnOrderSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsReorderLevel@", ProductsReorderLevel) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsReorderLevelSTYLE@", ProductsReorderLevelSTYLE) LOOP ' of oRSProducts DO WHILE IF Seq < RecordsPageSize THEN Seq = (RecordsPageSize - Seq) DO UNTIL Seq < 0 DataRowFilledText = DataRowFilledtext & DataRowEmptyText Style = "MyDataRow" ProductsAutomaticDetailLinkSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsAutomaticDetailLink@", " ") DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsAutomaticDetailLinkSTYLE@", ProductsAutomaticDetailLinkSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsProductName@", " ") ProductsProductNameSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsProductNameSTYLE@", ProductsProductNameSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@CategoriesCategoryName@", " ") CategoriesCategoryNameSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@CategoriesCategoryNameSTYLE@", CategoriesCategoryNameSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@SuppliersCompanyName@", " ") SuppliersCompanyNameSTYLE = "TableRow" & style
215
DataRowFilledtext = Replace(DataRowFilledtext,"@SuppliersCompanyNameSTYLE@", SuppliersCompanyNameSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsQuantityPerUnit@", " ") ProductsQuantityPerUnitSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsQuantityPerUnitSTYLE@", ProductsQuantityPerUnitSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitPrice@", " ") ProductsUnitPriceSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitPriceSTYLE@", ProductsUnitPriceSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsInStock@", " ") ProductsUnitsInStockSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsInStockSTYLE@", ProductsUnitsInStockSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsOnOrder@", " ") ProductsUnitsOnOrderSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsUnitsOnOrderSTYLE@", ProductsUnitsOnOrderSTYLE) DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsReorderLevel@", " ") ProductsReorderLevelSTYLE = "TableRow" & style DataRowFilledtext = Replace(DataRowFilledtext,"@ProductsReorderLevelSTYLE@", ProductsReorderLevelSTYLE) Seq = (Seq - 1) LOOP END IF END FUNCTION '-----------------------------------------------------------------------'
216
Function: BuildFooter
This function contains the navigation bar (hence the link tags) and the label indicating page # of #, and is the last function in the browse ASP file:
'=======================================================================' FUNCTION buildFooter ' buildFooter Function ' '======================================================================' iStart = (((PageIndex - 1 ) * RecordsPageSize ) + 1) iEnd = (PageIndex) * (RecordsPageSize) IF iEnd < oRSProducts.RecordCount THEN iEnd = iEnd ELSE iEnd = oRSProducts.RecordCount END IF ref = "" IF ShowDBNav THEN TableFooter = TableFooter & CSTR(iStart) & " - " & CSTR(iEnd)& " of " & TotalRecords &"<BR>" '' okay this is the First Page ref = "" counter = PageIndex IF CINT(counter) > 1 THEN IF Request.QueryString("ID1") <> "" THEN ref= ref & "<a href=" & myPage & "?PageIndex=1&ID1=" & Request.QueryString("ID1") &"><img src='" & IconFirst & "' border='" & IconBorder &"' height='" & IconHeight & "' width='" & IconWidth & "' alt='First page'></a>" ELSE ref= ref & "<a href=" & myPage & "?PageIndex=1><img src='" & IconFirst & "' border='" & IconBorder &"' height='" & IconHeight & "' width='" & IconWidth & "' alt='First page'></a>" END IF ELSE ref = "<img src='" & IconFirstDisabled & "' alt='First page' border='" & IconBorder & "' height='" & IconHeight & "' width='" & IconWidth & "' >" END IF TableFooter = TableFooter & ref '' okay this is the Prior Page ref = "" counter = PageIndex IF CINT(counter) > 1 THEN IF Request.QueryString("ID1") <> "" THEN ref= ref & "<a href='" & myPage & "?PageIndex=" & (counter - 1) & "&ID1=" & Request.QueryString("ID1") &"'><img src='" & IconPrior & "' border='" & IconBorder &"' height='" & IconHeight & "' width='" & IconWidth & "' alt='Prior page'></a>" ELSE ref= ref & "<a href='" & myPage & "?PageIndex=" & (counter - 1) &"'><img src='" & IconPrior & "' border='" & IconBorder &"' height='" & IconHeight & "' width='" & IconWidth & "' alt='Prior page'></a>" END IF ELSE ref = "<img src='" & IconPriorDisabled & "' alt='Prior page' border='" & IconBorder &"' height='" & IconHeight & "' width='" & IconWidth & "'>" END IF
217
TableFooter = TableFooter & ref '' okay now the Next Page ref = "" counter = PageIndex IF CINT(counter) < CINT(MaxPages) THEN IF Request.QueryString("ID1") <> "" THEN ref= ref & "<a href=" & myPage & "?PageIndex=" & (counter + 1) & "&ID1=" & Request.QueryString("ID1") &"><img src='" & IconNext & "' border='" & IconBorder & "' height='" & IconHeight & "' width='" & IconWidth & "' alt='Next page'></a>" ELSE ref= ref & "<a href=" & myPage & "?PageIndex=" & (counter + 1) & "><img src='" & IconNext & "' border='" & IconBorder & "' height='" & IconHeight & "' width='" & IconWidth & "' alt='Next page'></a>" END IF ELSE ref = "<img src='" & IconNextDisabled & "' alt='Next page' border='" & IconBorder & "' height='" & IconHeight & "' width='" & IconWidth & "'>" END IF TableFooter = TableFooter & ref '' okay now the Last Page ref = "" counter = PageIndex IF CINT(counter) < CINT(MaxPages) THEN IF Request.QueryString("ID1") <> "" THEN ref= ref & "<a href=" & myPage & "?PageIndex=" & MaxPages & "&ID1=" & Request.QueryString("ID1") &"><img src='" & IconLast & "' border='" & IconBorder & "' height='" & IconHeight & "' width='" & IconWidth & "' alt='Last page'></a>" ELSE ref= ref & "<a href=" & myPage & "?PageIndex=" & MaxPages & "><img src='" & IconLast & "' border='" & IconBorder &"' height='" & IconHeight & "' width='" & IconWidth & "' alt='Last page'></a>" END IF ELSE ref = "<img src='" & IconLastDisabled & "' alt='Last page' border='" & IconBorder & "' height='" & IconHeight & "' width='" & IconWidth & "'>" END IF TableFooter = TableFooter & ref FooterText = Replace(FooterText,"@TableFooter@", TableFooter) %> <% END IF ' of ShowDBNav END FUNCTION '----------------------------------------------------------------------' %>
218
Edit/Update Page
Clarion/ASP update pages come in four flavors: add a blank record, edit an existing record, delete an existing record, and view (no edit) an existing record. This annotates editing an existing record, which displays the most complicated functionality of the four. The update is divided into the edit page, which gets and formats the data, and the processor page, which actually submits the update. First well explain the former:

Include Files and Declarations

Because most of the real work is done in the processor page, the only declarations are the variables for the buttons on the form:
   <% '' DebugMode is defined in AppData.asp as FALSE by default '' debug of this page only by uncommenting the next line '' DebugMode = TRUE '' %> <% ''# this next block creates each of the temporary variables for the merge process DIM DeleteButton DIM UpdateProductsFormAction
219
The MergeTemplate Function

This function opens the HTML runtime template containing the HTML form, and populates the controls with the data and any formatting options necessary:
'=======================================================================' '' MergeTemplate '=======================================================================' Function MergeTemplate(templatepath) If(templatepath = "") then templatepath = "html/UpdateProductsEdit.htm" End If Set FileObject = Server.CreateObject("Scripting.FileSystemObject") TemplateText = Server.MapPath(templatepath) Set InStream = FileObject.OpenTextFile (TemplateText, 1, False, False) TemplateText = Empty While not InStream.AtEndOfStream TemplateText = TemplateText & InStream.ReadLine & vbcrlf Wend TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"@DeleteButton@",DeleteButton) TemplateText = Replace(TemplateText,"@UpdateProductsFormAction@",UpdateProductsFormAction) Set Instream = Nothing TemplateText = Replace(TemplateText, "@ProductsProductName@", ProductsProductName) TemplateText = Replace(TemplateText, "@ProductsProductID@", ProductsProductID) TemplateText = Replace(TemplateText, "@ProductsSupplierID@", ProductsSupplierID) TemplateText = Replace(TemplateText, "@ProductsCategoryID@", ProductsCategoryID) TemplateText = Replace(TemplateText, "@ProductsQuantityPerUnit@", ProductsQuantityPerUnit) TemplateText = Replace(TemplateText, "@ProductsUnitPrice@", ProductsUnitPrice) TemplateText = Replace(TemplateText, "@ProductsUnitsInStock@", ProductsUnitsInStock) TemplateText = Replace(TemplateText, "@ProductsUnitsOnOrder@", ProductsUnitsOnOrder) TemplateText = Replace(TemplateText, "@ProductsReorderLevel@", ProductsReorderLevel) TemplateText = Replace(TemplateText, "@ProductsDiscontinued@", ProductsDiscontinued) TemplateText = Replace(TemplateText, "@ID1@", ID1) Response.Write(TemplateText) END Function
220
Open the Record Set

The next section opens the record set and checks for errors. It also verifies that it was properly passed a parameter identifying the record.
'' create the connection object Dim objCN Set objCN = Server.CreateObject("ADODB.Connection") objCN.ConnectionTimeout = Application("MyASP_ConnectionTimeOut") objCN.CommandTimeout = Application("MyASP_CommandTimeOut") objCN.CursorLocation = Application("MyASP_CursorLocation") objCN.Open Application("MyASP_ConnectionString"), Application("MyASP_RuntimeUserName"), Application("MyASP_RuntimePassword") DIM oRSProducts, ClarionData set oRSProducts = Server.CreateObject("ADODB.Recordset") CheckError %> <% IF DebugMode THEN %>  <% END IF ' of DebugMode block %> <% '' this bit ensures that we got to this page correctly myParams = "" DIM ID1 ID1 = "" IF Request("ID1") > "" THEN ID1 = Request("ID1") myParams = "ID1=" & ID1 END IF IF REQUEST("ID1") = "" THEN CALL displayBadRecord END IF ID1 = REQUEST("ID1")
Function: displayBadRecord
This function places a message on a new page if no record was obtainable:
FUNCTION displayBadRecord ClarionData = ClarionData & "<div class='bg'>" & vbCRLF ClarionData = ClarionData & "<table class='Data' border=0 cellspacing=0 cellpadding=0>" & vbCRLF ClarionData = ClarionData & " <tr><td width='80%' class='Header'>Status</td>" ClarionData = ClarionData & "<td align='right' class='Header'> <a href='JAVASCRIPT:history.back();'><img alt='Back' src='/images/Back.Gif' border=0></a></td>" ClarionData = ClarionData & "</tr>" & vbCRLF ClarionData = ClarionData & "<tr><td class='Input' colspan='2'>The requested record could not be found<br>" & vbCRLF ClarionData = ClarionData & "<a href=BrowseProductsNoRangeSelect" & "List.asp" & myParams & ">Return to list</a>" & vbCRLF ClarionData = ClarionData & "</td></tr>" & vbCRLF ClarionData = ClarionData & "</table>" & vbCRLF ClarionData = ClarionData & "</div>" & vbCRLF Call MergeEditTemplate("html/blank.htm") END FUNCTION
221
MergeEditTemplate Function
This function opens the runtime HTML template and performs the symbol substitution necessary to place the proper data in the HTML controls on the HTML form.
''=============================================================== '' MergeTemplate ''=============================================================== FUNCTION MergeEditTemplate(templatepath) If(templatepath = "") then templatepath = "html/blank.htm" End If Set FileObject = Server.CreateObject("Scripting.FileSystemObject") TemplateText = Server.MapPath(templatepath) Set InStream = FileObject.OpenTextFile (TemplateText, 1, False, False) TemplateText = Empty While not InStream.AtEndOfStream TemplateText = TemplateText & InStream.ReadLine & vbcrlf Wend Set Instream = Nothing '' resolve any includes TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"@ClarionData@",ClarionData) Response.Write(TemplateText) END FUNCTION
Get the Record

The next section provides the SQL SELECT statement, opens the record set, checks for any database error, loads the record (the MoveFirst method; this is necessary even if theres only one record), and checks for a database error again. Then, if in debug mode, debug information is output:
strSQL = "SELECT dbo.Products.ProductName, dbo.Products.ProductID, dbo.Products.SupplierID, dbo.Products.CategoryID, dbo.Products.QuantityPerUnit, dbo.Products.UnitPrice, dbo.Products.UnitsInStock, dbo.Products.UnitsOnOrder, dbo.Products.ReorderLevel, dbo.Products.Discontinued FROM dbo.Products WHERE dbo.Products.ProductID = " & CSTR(Request("ID1")) oRSProducts.Open strSQL, objCN, adOpenStatic, adLockOptimistic CheckError oRSProducts.MoveFirst CheckError %> <% IF DebugMode THEN %>  <% END IF ' of DebugMode block%> <%IF DebugMode THEN %>  <% END IF %> <%
Set the Form Action

This section instructs the form button what page to post the form data to when the end user presses the submit button; in other words, this is the part that invokes the processor page, passing the unique value to identify the record:
UpdateProductsFormAction = "UpdateProductsEditX.asp" oRSProductsProductID = oRSProducts.Fields("Pro:ProductID").Value ID1 = REQUEST("ID1")
Get the Field Values

The following section declares a variable for each form field, and gets it from the record set. We dont want to dump the values directly into the HTML form, because we must check for nulls, do any necessary formatting, etc.
DIM ProductsProductName IF IsNULL(oRSProducts.Fields("ProductName").Value) THEN ProductsProductName = "" ELSE ProductsProductName = TRIM(oRSProducts.Fields("ProductName").Value) END IF DIM ProductsProductID IF IsNULL(oRSProducts.Fields("ProductID").Value) THEN ProductsProductID = "" ELSE ProductsProductID = oRSProducts.Fields("ProductID").Value END IF DIM ProductsSupplierID IF IsNULL(oRSProducts.Fields("SupplierID").Value) THEN ProductsSupplierID = "" ELSE ProductsSupplierID = oRSProducts.Fields("SupplierID").Value END IF DIM ProductsCategoryID IF IsNULL(oRSProducts.Fields("CategoryID").Value) THEN ProductsCategoryID = "" ELSE ProductsCategoryID = oRSProducts.Fields("CategoryID").Value END IF DIM ProductsQuantityPerUnit IF IsNULL(oRSProducts.Fields("QuantityPerUnit").Value) THEN ProductsQuantityPerUnit = "" ELSE ProductsQuantityPerUnit = TRIM(oRSProducts.Fields("QuantityPerUnit").Value)

END IF DIM ProductsUnitPrice IF IsNULL(oRSProducts.Fields("UnitPrice").Value) THEN ProductsUnitPrice = "" ELSE ProductsUnitPrice = oRSProducts.Fields("UnitPrice").Value END IF DIM ProductsUnitsInStock IF IsNULL(oRSProducts.Fields("UnitsInStock").Value) THEN ProductsUnitsInStock = "" ELSE ProductsUnitsInStock = oRSProducts.Fields("UnitsInStock").Value END IF DIM ProductsUnitsOnOrder IF IsNULL(oRSProducts.Fields("UnitsOnOrder").Value) THEN ProductsUnitsOnOrder = "" ELSE ProductsUnitsOnOrder = oRSProducts.Fields("UnitsOnOrder").Value END IF DIM ProductsReorderLevel IF IsNULL(oRSProducts.Fields("ReorderLevel").Value) THEN ProductsReorderLevel = "" ELSE ProductsReorderLevel = oRSProducts.Fields("ReorderLevel").Value END IF DIM ProductsDiscontinued IF IsNULL(oRSProducts.Fields("Discontinued").Value) THEN ProductsDiscontinued = "" ELSE IF (oRSProducts.Fields("Discontinued").Value) THEN ProductsDiscontinued = "CHECKED" ELSE ProductsDiscontinued = "" END IF END IF
223
Display (or Not) the Delete Button

If a delete is allowed, we display a button, if not, we dont:
IF (SESSION("UserLevel") >= DeleteLevel) THEN DeleteButton = "<FORM METHOD='post' ACTION='UpdateProductsDel.asp' ID='form1' NAME='form1'>" DeleteButton = DeleteButton & "<input TYPE='hidden' ID='ID1' NAME='ID1' VALUE='@ID1@'>" DeleteButton = DeleteButton & "<INPUT TYPE='submit' VALUE='Delete' TITLE='Delete this record' ID='submit1' NAME='submit1'>" DeleteButton = DeleteButton & "</FORM>" ELSE DeleteButton = "" End IF
224
Call the Merge Function and End

The final section calls the merge template function, explained above, and closes the connection. At this point, everything awaits user input, and pressing the Submit button will forward it to the edit Processor page.
CALL MergeTemplate("HTML/UpdateProductsEdit.htm") SET oRSProducts = Nothing '' close and destroy the connection object objCN.Close SET objCN = NOTHING %>
225
The Edit Processor Page

The processor page does the actual work of updating the data, and is called by the edit page when the end user presses the Submit button.

Include Files
Then, the include files are processed. AppData contains several global declarations, such as icon sizes and image names, debug options as set in the global template, and so on. ADOVBS contains declarations necessary for accessing ADO. Utils contains many helper functions.
  
226
Variable Declarations and Open the Record Set

So far the code has been identical to the browse code. Next, the code declares the connection object, gets the necessary information for the connection from the session variables, opens the connection and initializes the record set. It calls the CheckError function after the database access.
<% '' create the connection object Dim objCN Set objCN = Server.CreateObject("ADODB.Connection") objCN.ConnectionTimeout = Application("MyASP_ConnectionTimeOut") objCN.CommandTimeout = Application("MyASP_CommandTimeOut") objCN.CursorLocation = Application("MyASP_CursorLocation") objCN.Open Application("MyASP_ConnectionString"), Application("MyASP_RuntimeUserName"), Application("MyASP_RuntimePassword") Dim oRSProducts, myError, myStatus Set oRSProducts = Server.CreateObject("ADODB.Recordset") CheckError
227
The MergeTemplate Function

The MergeTemplate function opens the runtime HTML template so that the rest of the code can evaluate whatever is necessary for the HTML page and the HTML form it contains, replace the symbols in the template with the necessary data, and output it to the browser client:
'======================================================================' '' MergeTemplate '======================================================================' Function MergeEditTemplate(templatepath) If(templatepath = "") then templatepath = "html/generic.htm" End If Set FileObject = Server.CreateObject("Scripting.FileSystemObject") TemplateText = Server.MapPath(templatepath) Set InStream = FileObject.OpenTextFile (TemplateText, 1, False, False) TemplateText = Empty While not InStream.AtEndOfStream TemplateText = TemplateText & InStream.ReadLine & vbcrlf Wend Set Instream = Nothing '' resolve any includes TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"",loadInclude("")) TemplateText = Replace(TemplateText,"@ClarionData@",ClarionData) Response.Write(TemplateText) END Function %>
Check for Not Found

Because its an update form, the code has to verify that it received a parameter with a unique ID. This section initializes a flag, checks the ?ID1 parameter, and then outputs a No Record Found page if it didnt receive a unique value to identify the record:
<% IF DebugMode THEN %>  <% END IF ' of DebugMode block %> <% '' this bit ensures that we got to this page correctly DIM bolNotFound boLNotFound = False
228
IF REQUEST("ID1") = "" THEN bolNotFound = True END IF
IF bolNotFound = True THEN ClarionData = ClarionData & "<div class='bg'>" & vbCRLF ClarionData = ClarionData & "<table class='Data' border=0 cellspacing=0 cellpadding=0>" & vbCRLF ClarionData = ClarionData & " <tr><td width='80%' class='Header'>Status</td>" ClarionData = ClarionData & "<td align='right' class='Header'> <a href='JAVASCRIPT:history.back();'><img alt='Back' src='/images/Back.Gif' border=0></a></td>" ClarionData = ClarionData & "</tr>" & vbCRLF ClarionData = ClarionData & "<tr><td colspan='2' class='Input'>The requested record could not be found<br>" & vbCRLF ClarionData = ClarionData & "</td></tr>" & vbCRLF ClarionData = ClarionData & "</table>" & vbCRLF ClarionData = ClarionData & "</div>" & vbCRLF Call MergeEditTemplate("html/blank.htm") Response.End END IF
Get the Record

The next section provides the SQL SELECT statement, opens the record set, checks for any database error, loads the record (the MoveFirst method; this is necessary even if theres only one record), and checks for a database error again. Then, if in debug mode, debug information is output:
strSQL = "SELECT dbo.Products.ProductName, dbo.Products.ProductID, dbo.Products.SupplierID, dbo.Products.CategoryID, dbo.Products.QuantityPerUnit, dbo.Products.UnitPrice, dbo.Products.UnitsInStock, dbo.Products.UnitsOnOrder, dbo.Products.ReorderLevel, dbo.Products.Discontinued FROM dbo.Products WHERE dbo.Products.ProductID = " & CSTR(Request("ID1")) oRSProducts.Open strSQL, objCN, adOpenStatic, adLockOptimistic CheckError oRSProducts.MoveFirst CheckError %> <% IF DebugMode THEN %>  <% END IF ' of DebugMode block%> <%IF DebugMode THEN %>  <% END IF %>
229
Placing the Fields

The following is repeated for each field (see below), but this section describes the first field (the product name) on the form. First it tests if the field was required, and if its value is NULL, then a message is prepared indicating the value was missing. The code then tests the record set to verify that the field is updatable (else there would be no reason to put it in an edit control). It gets the actual value from the record set. It then checks the data type, and sets a null value to either 0 or an empty string, depending on the type, so that it can display the value in the edit box. It repeats this for each field.
<% flgMissing = 0 myStatus = "" '' Test for Required column IF( Request.Form("txtProductsProductName") = "" OR IsNUll(Request.Form("txtProductsProductName")) ) THEN IF myStatus = "" THEN myStatus = "<STRONG>Some data was missing</STRONG><BR><HR>" END IF flgMissing = 1 myStatus = myStatus & " <STRONG>Product Name</STRONG> " & ": Required field <HR>" & vbCRLF END IF '' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("ProductName").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("ProductName").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsProductName") > "" THEN oRSProducts.Fields("ProductName").Value = MID(Request.Form("txtProductsProductName"),1,oRSProducts.Fields("ProductName").Def inedSize) ELSE IF ( (oRSProducts.Fields("ProductName").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("ProductName").Value = NULL ELSE SELECT CASE oRSProducts.Fields("ProductName").Type CASE 7,14,131,139 oRSProducts.Fields("ProductName").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("ProductName").Value = "" END SELECT END IF END IF END IF
(from here the code repeats the previous code for each field on the page)
'' Test for Required column IF( Request.Form("txtProductsProductID") = "" OR IsNUll(Request.Form("txtProductsProductID")) ) THEN IF myStatus = "" THEN myStatus = "<STRONG>Some data was missing</STRONG><BR><HR>" END IF flgMissing = 1 myStatus = myStatus & " <STRONG>Product ID</STRONG> " & ": Required field <HR>" & vbCRLF END IF
230

'' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("ProductID").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("ProductID").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsProductID") > "" THEN oRSProducts.Fields("ProductID").Value = Request.Form("txtProductsProductID") ELSE IF ( (oRSProducts.Fields("ProductID").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("ProductID").Value = NULL ELSE SELECT CASE oRSProducts.Fields("ProductID").Type CASE 7,14,131,139 oRSProducts.Fields("ProductID").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("ProductID").Value = "" END SELECT END IF END IF END IF '' Test for Required column IF( Request.Form("txtProductsSupplierID") = "" OR IsNUll(Request.Form("txtProductsSupplierID")) ) THEN IF myStatus = "" THEN myStatus = "<STRONG>Some data was missing</STRONG><BR><HR>" END IF flgMissing = 1 myStatus = myStatus & " <STRONG>Supplier ID</STRONG> " & ": Must be in file " myStatus = myStatus & "<HR>" & vbCRLF END IF '' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("SupplierID").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("SupplierID").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsSupplierID") > "" THEN oRSProducts.Fields("SupplierID").Value = Request.Form("txtProductsSupplierID") ELSE IF ( (oRSProducts.Fields("SupplierID").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("SupplierID").Value = NULL ELSE SELECT CASE oRSProducts.Fields("SupplierID").Type CASE 7,14,131,139 oRSProducts.Fields("SupplierID").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("SupplierID").Value = "" END SELECT END IF END IF END IF '' Test for Required column IF( Request.Form("txtProductsCategoryID") = "" OR IsNUll(Request.Form("txtProductsCategoryID")) ) THEN IF myStatus = "" THEN myStatus = "<STRONG>Some data was missing</STRONG><BR><HR>" END IF flgMissing = 1 myStatus = myStatus & " <STRONG>Category ID</STRONG> " & ": Must be in file " myStatus = myStatus & "<HR>" & vbCRLF
231
END IF '' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("CategoryID").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("CategoryID").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsCategoryID") > "" THEN oRSProducts.Fields("CategoryID").Value = Request.Form("txtProductsCategoryID") ELSE IF ( (oRSProducts.Fields("CategoryID").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("CategoryID").Value = NULL ELSE SELECT CASE oRSProducts.Fields("CategoryID").Type CASE 7,14,131,139 oRSProducts.Fields("CategoryID").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("CategoryID").Value = "" END SELECT END IF END IF END IF '' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("QuantityPerUnit").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("QuantityPerUnit").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsQuantityPerUnit") > "" THEN oRSProducts.Fields("QuantityPerUnit").Value = MID(Request.Form("txtProductsQuantityPerUnit"),1,oRSProducts.Fields("QuantityPerUn it").DefinedSize) ELSE IF ( (oRSProducts.Fields("QuantityPerUnit").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("QuantityPerUnit").Value = NULL ELSE SELECT CASE oRSProducts.Fields("QuantityPerUnit").Type CASE 7,14,131,139 oRSProducts.Fields("QuantityPerUnit").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("QuantityPerUnit").Value = "" END SELECT END IF END IF END IF '' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("UnitPrice").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("UnitPrice").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsUnitPrice") > "" THEN oRSProducts.Fields("UnitPrice").Value = Request.Form("txtProductsUnitPrice") ELSE IF ( (oRSProducts.Fields("UnitPrice").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("UnitPrice").Value = NULL ELSE SELECT CASE oRSProducts.Fields("UnitPrice").Type CASE 7,14,131,139 oRSProducts.Fields("UnitPrice").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("UnitPrice").Value = "" END SELECT END IF END IF END IF
232

'' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("UnitsInStock").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("UnitsInStock").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsUnitsInStock") > "" THEN oRSProducts.Fields("UnitsInStock").Value = Request.Form("txtProductsUnitsInStock") ELSE IF ( (oRSProducts.Fields("UnitsInStock").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("UnitsInStock").Value = NULL ELSE SELECT CASE oRSProducts.Fields("UnitsInStock").Type CASE 7,14,131,139 oRSProducts.Fields("UnitsInStock").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("UnitsInStock").Value = "" END SELECT END IF END IF END IF '' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("UnitsOnOrder").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("UnitsOnOrder").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsUnitsOnOrder") > "" THEN oRSProducts.Fields("UnitsOnOrder").Value = Request.Form("txtProductsUnitsOnOrder") ELSE IF ( (oRSProducts.Fields("UnitsOnOrder").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("UnitsOnOrder").Value = NULL ELSE SELECT CASE oRSProducts.Fields("UnitsOnOrder").Type CASE 7,14,131,139 oRSProducts.Fields("UnitsOnOrder").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("UnitsOnOrder").Value = "" END SELECT END IF END IF END IF '' test for updateable column 4 updatable 8 for unknown updateable IF ( (oRSProducts.Fields("ReorderLevel").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("ReorderLevel").Attributes AND &H00000008)=&H00000008) THEN IF Request.Form("txtProductsReorderLevel") > "" THEN oRSProducts.Fields("ReorderLevel").Value = Request.Form("txtProductsReorderLevel") ELSE IF ( (oRSProducts.Fields("ReorderLevel").Attributes AND &H00000020)=&H00000020) THEN oRSProducts.Fields("ReorderLevel").Value = NULL ELSE SELECT CASE oRSProducts.Fields("ReorderLevel").Type CASE 7,14,131,139 oRSProducts.Fields("ReorderLevel").Value = 0 CASE 8,129,203,202,200,130 oRSProducts.Fields("ReorderLevel").Value = "" END SELECT END IF END IF END IF '' test for updateable column 4 updatable 8 for unknown updateable
233
IF ( (oRSProducts.Fields("Discontinued").Attributes AND &H00000004)=&H00000004 OR (oRSProducts.Fields("Discontinued").Attributes AND &H00000008)=&H00000008) THEN IF(Request.Form("txtProductsDiscontinued") <> "") THEN oRSProducts.Fields("Discontinued").Value = 1 ELSE oRSProducts.Fields("Discontinued").Value = 0 END IF END IF
234
Send the Data to the Merge

The final section calls the MergeEditTemplate function (explained above). It also ouputs a Your update succeeded succeeded message (after returning from the processor page, and closes the database connection.
IF ( flgMissing = 0 ) THEN oRSProducts.Update CheckError oRSProducts.Close myStatus = "Your update succeeded <BR><BR>" myStatus = myStatus & "<a href='BrowseProductsNoRangeSelectList.asp" IF(SESSION("BrowseProductsNoRangeSelect#WHR")<>"") THEN myStatus = myStatus & "?SUBSET=TRUE" END IF myStatus = myStatus & "'>Return to list</a>." END IF Response.Clear myError = ProcessErrors() IF myError > "" THEN myStatus = myError ELSE IF myStatus = "" THEN myStatus = "Your update succeeded <br><br>" END IF END IF ClarionData = ClarionData & "<div class='bg'>" & vbCRLF ClarionData = ClarionData & "<table class='Data' border=0 cellspacing=0 cellpadding=0>" & vbCRLF ClarionData = ClarionData & " <tr><td width='80%' class='Header'>Status</td>" ClarionData = ClarionData & "<td align='right' class='Header'> <A href='JAVASCRIPT:history.back();'><IMG alt='Back' src='images/Back.Gif' border=0></A></td>" ClarionData = ClarionData & "</tr>" & vbCRLF ClarionData = ClarionData & " <tr><td class='Input' colspan='2'>" & myStatus & "<br></td></tr>" & vbCRLF ClarionData = ClarionData & "</table>" & vbCRLF ClarionData = ClarionData & "</div>" & vbCRLF Call MergeEditTemplate("HTML/blank.htm") set oRSProducts = nothing '' close and destroy the connection object objCN.Close SET objCN = NOTHING %>
235

Clarion ASP

Transféré par

Informations du document

Description originale:

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Clarion ASP

Transféré par

Droits d'auteur :

Formats disponibles

CLARION/ASP CLARION/ASP Annotated Examples Annotated Examples

CLARION/ASP Annotated Examples

COPYRIGHT 1994-2003 SoftVelocity Incorporated. All rights reserved.

Printed in the United States of America (0204)

CLARION/ASP Annotated Examples

Simple One Table Application

The To Do List Application

Search Contacts Example

The Orders Example

CLARION/ASP Annotated Examples

Customizing Generated Pages

Pubs Example ASP Code Walkthrough

CLARION/ASP Preliminary: Setup

The Dictionary Changes

The /images Virtual Directory

CLARION/ASP Simple One Table Application

Simple One Table Application

Applying the Global Extension

CLARION/ASP Simple One Table Application

CLARION/ASP Annotated Examples

Press the Connection Builder button.

CLARION/ASP Simple One Table Application

CLARION/ASP Simple One Table Application

Applying the Browse Extension

CLARION/ASP Annotated Examples

Applying the Form Extension

CLARION/ASP Annotated Examples

Generation and Setting Up IIS

CLARION/ASP Simple One Table Application 2. 3. 4. 5.

CLARION/ASP Annotated Examples

Testing the Application

CLARION/ASP Simple One Table Application

CLARION/ASP The To Do List Application

The To Do List Application

Run the Application Wizard

CLARION/ASP The To Do List Application

The application appears as a default application containing six procedures.

Set the Global Template Options

Set up the Style Sheet

9. 10. 11. 12. 13. 14.

20. 21. 22.

Applying the Style Sheet to the Project

Press OK to return to the Global template options.

Run the Connection Wizard

Press the Connection Builder button.

Provider=SQLOLEDB.1;Password=YourPassword;Persist Security Info=True;User ID=YourUsername;Data Source=YourDataServer

Set Security Options

CLARION/ASP Annotated Examples

Finish the Global Options

When ready, press OK twice to close the Global options dialog.

CLARION/ASP Annotated Examples

Applying the Browse Template

CLARION/ASP The To Do List Application

Enable My Records Filtering

Specifying Columns for the Browse

CLARION/ASP The To Do List Application

Customize Individual Fields

CLARION/ASP The To Do List Application

CLARION/ASP Annotated Examples

Applying the Form Template

Enable My Records Filtering

CLARION/ASP Annotated Examples

Set Actions Options