Downloads

Overview

Demo

Quick Start

Email

Important DownLoads

FWAdmin EAR Download

DataBase Backup File

JCounselorForm Database

The Sample Application: Part 1 of 3

Using Data Objects with AsyncDO

This sample represents the latest in AsyncFW Data Object (AsyncDO). While the other, older samples, are still valid and useful – this tutorial represents the 2.0 framework. If you have not yet read the FWAdmin introduction tutorial, you should do so first.

A bit about AsyncDO

This is not Hibernate or JDO – AsyncDO is a very lightweight AsyncFW version of those fine applications. While AsyncFW offers its own DO handler, there is nothing to preclude you from using any DO/persistence model you like.

With version 2.0 of the AsyncFW framework, you can now perform persistent data object type functions. That is, you can access your data tables as classes. Two new main classes have been added to facilitate DO interactions - SqlDOConnector, and SqlDOManager. Used together, these two classes can be used to access and update the underlying tables.

In this tutorial we will build the JCounselor dynamic web project. This new application will demonstrate the power and simplicity of using POJO+ (plain old java objects, plus a little help) as a logical extension of the underlying tables.

To facilitate this new Data object/table paradigm, the FWAdmin tool has been updated. Please Download the latest FWAdminEAR. Also, the Forms database model has also changed. To migrate and existing 1.n application to 2.0 see the Upgrade Doc.

Setup your new project:

1) You must have the latest FWAdmin Application installed and running. If not, download the FWAdminEAR.ear and deploy it.

2) Create a Dynamic web project named JCounselor

3) Download the required libraries and add them to your projects /lib folder

4) Download the WebContent html folder structure and add it to your project’s /WebContent folder.

5) Create/Install the FWMaster and FWDefault properties files (more on this shortly)

6) Create a package named “com.jc”

7) Crate another packaged named “com.jc.obj”

Creating the Forms and Application Databases.

Next we are going to need a database, in fact, let’s create two databases. One to be our forms database, and another to be our application database. This is a departure from our earlier tutorials where we used FWConPool for both.

Create two new MySQL databases named JCounselor, and JCounselorForm. Then Download the Database structure/data scripts below, and run them against their respective databases.

JCounselorForm Database

JCounselor Database

(Right click and ‘Save Target as…’)

You will need to configure these databases connection pools within Glassfish as JNDI references. For help in doing that, please refer to this tutorial FrameWorkSetupII. For simplicity name the JNDI references as follows;

jdbc/JCounselor

jdbc/JCounselorForm

Once correctly imported, your two new databases should look like the above.

Using FWAdmin to create the application.

By default the FWAdmin application is not configured to use the JCounselorForm database, so we will need to modify its properties to so that we can start creating our new application’s Forms database. If you are unfamiliar with the AsyncFW framework’s usage of a Forms database, you may want to read the Forms Database tutorial. All AsyncFW applications have the option of using a forms database, and the FWAdmin is just that.

We will need to modify the FWAdmin properties files to use the two new Databases. There are two ways to do this. First you can open the Archive (FWAdminEAR.ear), and edit them directly, then redepoy. Or you can simply go to the directory where the exploded EAR is installed and edit the files directly, and restart the server. Either way is fine.

Option I

In the above, I have used 7ZIP to open the archive EAR, and then to opened the embedded WAR file and navigated to the WEB-INF\classes directory. Now I can extract, edit and re-add the properties files to the EAR.

Option II

For the second option, simply opened up the directory that contains the GlassFish install (c:\SUN) in this case, and then drilled down to the appropriate directory (your path should be very close to the above).

Perform the following edits.

FWMaster.properties changes:

file.property.1 = /FWDefault.properties

Environment = dev

replace.dev.LogName = Framework_dev

replace.dev.LogFileName = Framework_log.html

replace.dev.FormsDB = jdbc/JCounselorForm

replace.dev.ApplicationDB = jdbc/JCounselor

FWDefault.properties changes:

##########################################

# Database properties

class.com.FW.properties.DBProps = DBProps

DBProps.setUser = n/a

DBProps.setPassword = n/a

DBProps.setFormDataBase = @FormsDB@

DBProps.putAppDatabase.1 = @ApplicationDB@

Re/Start your server, and launch FWAdmin to validate that everything is working correctly.

Logon with UserName: ‘a’ and Password ‘a’.

Once you logon, click the Edit Forms button.

If you have used FWAdmin prior to 2.0, you will notice that there is a new section labeled “Import Table as a Form, and columns as Fields on that form.”. In the earlier releases, you were required to manually create a new form, add all your fields, then associate those fields to the form. While this is still possible and even required for non-database related forms, this new feature can help short cut that effort by allowing you to import a table from any JNDI container managed data source. You also have the option of specifying the Form’s Database that the new form and fields will be imported into.

NOTE: FWAdmin is a crude, and not a very user friendly tool. It is to be used by developers only, and is intended as a time saving tool only. It is squirrelly and in desperate need of redevelopment – someday soon!

Converting Tables to Forms:

For each table in the JCounselor database, we want to make a corresponding form. To do this, enter the name of the source database and the name or the target Forms database as shown above. Then enter each table name (case matters) and click the Generate JavaScript button. Repeat this process for every table in the database.

Seeing the results.

Click the “Assemble Forms” button

Select the “contactlocation” form to see all the fields now associated with this new form. Notice that there are four buttons added – Add, Update, Delete and Find. These are assumed, and can be removed later if they are not needed. To edit the individual field values, you will need to click the “Edit Fields” button. This might be a good idea, since the default tool tips are not very helpful (see mouseOver value on the Field Screen).

Note: There is a new feature on this screen – The “Generate DO *.java” button. This option will generate an AsyncDO compatible java source file which can be saved to your project.

Creating the Class, xsl, javascript and DO objects.

Select the “contactlocation” form and fill out the remainder of the fields as shown.

NOTE: This assumes you have created your new project, and that you have added a package named “com.jpc” and “com.jpc.obj”, if not do so now.

Generate the XSL:

Save the target file into your new project in the Webcontent/html/xsl/ directory. If you don’t have the “html” directory structure, download it here. And expand it into your projects Webcontent folder.

NOTE: Make sure you save the file as contactlocation.xsl and not the default .xml.

Generate the Java Script:

Click the “Generate Form *.js” button, then save the resulting Java script file to the WebContent/html/scripts/pages directory.

NOTE: Make sure you save the file as contactlocation.js and not the default .html.

Generate the Form Java Source:

Click the “Generate Form *.java” button, and save the resulting file to the src/com/jc folder.

NOTE: Make sure you save the file as contactlocation.java and not the default .html.

Generate the DO java class:

This class will have the same name as your screen prefixed with a ‘Do’, and the FWAdmin tool assumes it will be in a sub-package named *.obj - This is why we created the com.jc.obj package.

Anyway – Generate the DO and save it as DoContactlocation.java in the src/com/jc/obj package.

Rinse and Repeat

Now we just to repeat the above steps for all the new forms. Simply pull down the “Select form” drop down, and select the next new form “contactvoice”, once again, click each button and save the resulting file into the proper location. Once all the files have been built for every new form. Refresh your project.

Hint: For the second form, click the buttons in reverse order (bottom to top), then for the third, top to bottom – and so on. This will reduce the number of directory navigations you will need to perform J

Common Errors: Not renaming the xsl extension for the xsl file – for some reason it always defaults to *.xml. And secondly, not putting your *.js file in the /scripts/pages/ directory.

Once you have imported all your forms, your project should look something like the one on the left. You may have some errors to fix, but for the most part they should be simple conflicts. For example if had a field in your table that was also a Java reserve word. This is an easy fix, simply rename the private variable, but don’t change the getter and setters. The local variable name is not important. The important information is the name of the getter and setter.

Also, your method names may not be java standard camel case, the method names match the table column names – and they must remain so. Do not attempt to “pretty-up” the code beyond formatting.

It is now time to dig into the concepts of DO development – as well as some good AsyncFW basics. It is not required that you have any experience with AsyncFW to continue on with this tutorial. If this is your first time using AsyncFW, and you feel lost – please read some of the other tutorials available on the site.

Creating a Logon Screen:

There is a separate tutorial for creating a logon screen Please refer to that tutorial – or simply use the CustomerLogon screen that is already in the Database and assemble it, as you did above, for the forms based on tables.

Note: You will not need to create the DO Java file for the CustomerLogon screen.

Modify the Start.html

The Start.html file is included in the html.zip download. It is the page you will refer too when running your application. Below is the default.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>JCounselor</title>

<!--

IMPORTANT: The core Java Script classes

-->

<!--

The FWDirect.js script is auto-generate by the AsyncFW framework. It contains

the JavaScript 'classes' associated used for Direct Web Requests

-->

<!--

INCLUDE ALL YOUR PAGE SCRIPTS BELOW. REMEBER EACH 'PAGE' SHOULD

HAVE THEIR OWN JS FILE

-->

<script type="text/javascript" src="./scripts/pages/xxxxx.js"></script>

</head>

<!--

IMPORTANT: YOU MUST INCLUDE THE TOOLTIPS SCRIPT BELOW

-->

<!--

IMPORTANT: YOU MUST CHANGE THE PROJECT NAME TO MATCH YOUR PROJECT

-->

var sysProjectName = "xxxxx";

</script>

<!--

Start of Parent page frame

-->

<TR>

<TD align='right'><img name="imgPleaseWait" id="imgPleaseWait"

src="./images/pleasewait.gif" /></TD>

</TR>

</TABLE>

<!--

IMPORTANT: The table below represents the body of your page

-->

<tr>

Loading Initial Settings...Please wait.

</div>

</td>

</tr>

</table>

<!--

IMPORTANT: This script snippet kicks off the entire process

-->

try{

AjaxRequestPage("xxxxx","Init", "Page", FormContextArea)

}catch(err){

alert("[Start.html].script: Failed to load JLogon:"+err);

}

</script>

</body>

</html>

The areas highlighted in blue, are the areas we are going to be modifying. The first is the “Page Scripts” section. Here we need to include all of the scripts we created with the FWAdmin tool.

<!--

INCLUDE ALL YOUR PAGE SCRIPTS BELOW. REMEBER EACH 'PAGE' SHOULD

HAVE THEIR OWN JS FILE

-->

Next we need to modify the sysProjectName variable to reflect the name of our project – JCounselor.

var sysProjectName = "JCounselor";

</script>

And Lastly we need to modify the JavaScript startup snippet to invoke the CustomerLogon Servlet (ServiceLet).

try{

AjaxRequestPage("CustomerLogon","Init", "Page", FormContextArea)

}catch(err){

alert("[Start.html].script: Failed to load JLogon:"+err);

}

</script>

Install the Properties Files

We have seen the AsyncFW properties files associated with the FWAdmin application, now we need to set them up for the new project. Here again you have two options - First download the properties.zip, and unzip the two files into the /src/ directory of your project, or copy the FWMaster and FWDefault.properties files from the FWAdmin installation. I recommend the second option as the FWAdmin configurations are already configured for our needs.

If you choose option 1 (download), then we will need to modify the FWMaster.properties file. Open the FWMaster.properties file and make the following edits;

replace.dev.LogName = Framework_dev

replace.dev.LogFileName = Framework_log

replace.dev.FormsDB = jdbc/JCounselorForm

replace.dev.ApplicationDB = jdbc/JCounselor

Web.XML

The last step is to configure your Web.xml. We have added a number of new AsyncFW ServiceLets (Servlets) to our application – these all need to be added to the Web.xml. We also need to add the database references and a few standard entries for the AsyncFW.

Below is the entire Web.xml – simply cut and past it over your existing web.xml file.

<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

xmlns="http://java.sun.com/xml/ns/javaee"

xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"

xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"

id="WebApp_ID" version="2.5">

<display-name>JCounselor</display-name>

<welcome-file-list>

<welcome-file>index.html</welcome-file>

<welcome-file>index.htm</welcome-file>

<welcome-file>index.jsp</welcome-file>

<welcome-file>default.html</welcome-file>

<welcome-file>default.htm</welcome-file>

<welcome-file>default.jsp</welcome-file>

</welcome-file-list>

<resource-ref>

<res-ref-name>jdbc/JCounselorForm</res-ref-name>

<res-type>javax.sql.DataSource</res-type>

<res-auth>Container</res-auth>

<res-sharing-scope>Shareable</res-sharing-scope>

</resource-ref>

<resource-ref>

<res-ref-name>jdbc/JCounselor</res-ref-name>

<res-type>javax.sql.DataSource</res-type>

<res-auth>Container</res-auth>

<res-sharing-scope>Shareable</res-sharing-scope>

</resource-ref>

<!--resource-ref>

<description>Default QueueFactory</description>

<res-ref-name>AsyncFWQFactory</res-ref-name>

<res-type>javax.jms.QueueConnectionFactory</res-type>

<res-auth>Container</res-auth>

</resource-ref>

<resource-ref>

<description>Default Queue</description>

<res-ref-name>AsyncFWQ</res-ref-name>

<res-type>javax.jms.Queue</res-type>

<res-auth>Container</res-auth>

</resource-ref -->

<display-name>FWDirect</display-name>

<servlet-name>FWDirect</servlet-name>

<servlet-class>com.FW.direct.FWDirect</servlet-class>

<load-on-startup>1</load-on-startup>

</servlet>

<servlet-mapping>

<servlet-name>FWDirect</servlet-name>

<url-pattern>/FWDirect</url-pattern>

</servlet-mapping>

<display-name>contactlocation</display-name>

<servlet-name>contactlocation</servlet-name>

<servlet-class>com.jc.contactlocation</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>contactlocation</servlet-name>

<url-pattern>/contactlocation</url-pattern>

</servlet-mapping>

<display-name>contactvoice</display-name>

<servlet-name>contactvoice</servlet-name>

<servlet-class>com.jc.contactvoice</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>contactvoice</servlet-name>

<url-pattern>/contactvoice</url-pattern>

</servlet-mapping>

<display-name>locationtype</display-name>

<servlet-name>locationtype</servlet-name>

<servlet-class>com.jc.locationtype</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>locationtype</servlet-name>

<url-pattern>/locationtype</url-pattern>

</servlet-mapping>

<display-name>person</display-name>

<servlet-name>person</servlet-name>

<servlet-class>com.jc.person</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>person</servlet-name>

<url-pattern>/person</url-pattern>

</servlet-mapping>

<display-name>persontype</display-name>

<servlet-name>persontype</servlet-name>

<servlet-class>com.jc.persontype</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>persontype</servlet-name>

<url-pattern>/persontype</url-pattern>

</servlet-mapping>

<display-name>phonetype</display-name>

<servlet-name>phonetype</servlet-name>

<servlet-class>com.jc.phonetype</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>phonetype</servlet-name>

<url-pattern>/phonetype</url-pattern>

</servlet-mapping>

<display-name>staff</display-name>

<servlet-name>staff</servlet-name>

<servlet-class>com.jc.staff</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>staff</servlet-name>

<url-pattern>/staff</url-pattern>

</servlet-mapping>

<display-name>stafftype</display-name>

<servlet-name>stafftype</servlet-name>

<servlet-class>com.jc.stafftype</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>stafftype</servlet-name>

<url-pattern>/stafftype</url-pattern>

</servlet-mapping>

<display-name>CustomerLogon</display-name>

<servlet-name>CustomerLogon</servlet-name>

<servlet-class>com.jc.CustomerLogon</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>CustomerLogon</servlet-name>

<url-pattern>/CustomerLogon</url-pattern>

</servlet-mapping>

</web-app>

The text above highlighted in BLUE represent the references to our new databases (it assumes you named your JNDI Resources as they are shown). The section highlighted in RED is required for all AsyncFW projects – and supports the dynamic creation of the FWDirect.js javascript as well as FWDirect. For more information on FWDirect – Click Here.

Refresh the project, restart the server

Let’s see what we have done.

http://localhost:8080/JCounselor/html/Start.html

Part Two>>.

S. Chappell