Creating a New Web Project | Understanding the IBM WebFacing Tool: A Guided Tour (IBM Illustrated Guide series)

To create a new Web project, you first need to open the Web perspective. Use Window ’ Open Perspective from the workbench menu bar.

In the Web perspective, create a new Web project with the name of SelectServer:

Use the project wizard on the workbench toolbar to invoke the Create a Web Project dialog.

Note
Make sure to create a Web project, and not a WebFacing project.

On the first page (Figure 20.6),

Figure 20.6: Create a Web Project dialog

Enter the following project name: SelectServer.
Click the Next push button.

On the second page of the Create a Web Project wizard (Figure 20.7),

Figure 20.7: The second page of the Create a Web Project wizard

Select the New radio button for the Enterprise application project.
Enter SelectServerEAR in the New project name entry field.
Click the Finish push button.

A new Web project is created.

Creating a Servlet

Now that you have created a Web project, you can create a servlet. In the J2EE Navigator view, expand the SelectServer Web project you just created, as shown in Figure 20.8.

Figure 20.8: Creating anew servlet

Select the Java Source directory.
Right-click Java Source and select the New option from the pop-up menu.
Select the Servlet option from the submenu.

The New Servlet wizard appears (Figure 20.9). Notice that the Folder information is prefilled.

Figure 20.9: New Servlet wizard

In the Java package field, enter orderentry .

Note	A Java package is just a grouping mechanism for Java classes, similar to what a Service Program is for RPG procedures. For more information on the Java language, check out the book Java for RPG Programmers , 2nd edition, by Phil Coulthard and George Farr.

In the Class name entry field, enter the following servlet name: SelectiSeriesServer .
Click the Finish button.

The Java source editor opens, filled with a skeleton servlet.

In this servlet, you will create one method called invokeOrderEntry. The browser requests the servlet, which in turn invokes the method. By default, this request is invoked either by the doGet or doPost methods, as part of standard servlet behavior. The wizard has already created both of these methods; all you need to do is call your new invokeOrderEntry method from both of these predefined methods .

Add the new method to the source after the curly bracket, }, for the doPost method just before the ending curly bracket for the class, as shown in Figure 20.10.

Figure 20.10: Method invokeOrderEntry added to servlet

The method definition is the same for the doPost/doGet methods, so you can simply copy and paste one of them, changing the name to invokeOrderEntry.

Add two curly brackets, { and }, to indicate the beginning and ending of your method. You will add the logic that goes in between these brackets soon.

Now you have to call your new method from the doPost and doGet methods to run this code when a request comes from the browser.

As shown in Figure 20.11, insert the following source to invoke inside the { } in both methods:
```
 invokeOrderEntry(req, resp); 
```
Figure 20.11: Method calls in doGet and DoPost methods

The parameters to pass are the request and response objects, when the doGet and doPost methods are called.

Don't forget the semicolon (;) after the statement.

Tip

You can use CodeAssist to help you with the Java coding. Just type "i" for the first letter of the method and then press Ctrl and Space. This invokes the CodeAssist feature that lists all known valid Java constructs in your environment starting with i. It will list the invokeOrderEntry method, and you can select it from there to save you some typing.

Now you can add logic to your method to invoke the WebFacing application on the selected server.

In the invokeOrderEntry method, add the following code after the curly bracket ({):

 // The url to use to invoke the application String url = "http://localhost:9080/wflabxx/WFLogon?inv=cl208846&host=" ;   // Getting the server name from web page String serverName = req.getParameter("server name");   // adding servername to url System.out.println("Host name: " + serverName); url = url + serverName; System.out.println("Invoking:" + url);        try {                 // invoking the sendRedirect method to invoke the applicaton                 resp.sendRedirect(url);        }        catch(Exception e) {                 System.out.println("Exception invoking application");        } }

Figure 20.12 shows the code in the editor.

Figure 20.12: Code in invokeOrderEntry method

You might wonder how I know which URL to specify for the WebFaced application. The information about the URL is documented in the WebFacing Help documentation. From that information, you can see that I use a URL which allows me to specify the server name with the rest of the connection information coming from the WebFacing project's invocation file.

Important:

You will need to change the name of the invocation file to your environment. To find the correct file name, you need to expand your WebFacing project according to the following path structure: wflabxx ’ Web Content ’ WEB-INF ’ classes ’ conf. Find the name of your .invocation file and use this name when specifying the inv keyword in the URL string in this servlet.

The lines that write information to System.out are not necessary for this servlet to function correctly, but they can help diagnose various problems. The text will appear in the application server's console when this servlet runs. Figure 20.13 shows a sample.

Figure 20.13: WAS console with messages from servlet

Save the Java file. If there are any error messages, fix the problem and save the file again.

Tip	Java syntax and semantic errors are detected as you edit the code. A problem indicator displays in the editor: a little light bulb as shown in Figure 20.14. Figure 20.14: Java source editor with problem indicator showing error for nondefined variable

In the sample in Figure 20.14, the variable name ur is incorrect because it is not defined. Clicking on the light bulb (that displays on the line where an error is detected) will offer you assistance to fix the problem. In Figure 20.14, the choice would be to change the name to url .

Note	Java names are case sensitive; make sure you use the correct case.

You have completed the necessary Java coding. Now you can use the Page Designer tool to create the Web page that prompts for the server name.

Creating a Web Page

In the Web perspective using the J2ee Navigator view (Figure 20.15), invoke the new HTML file wizard to create a Web page in your Web project.

Figure 20.15: Invoking the HTML wizard

Expand the SelectServer Web project.
Select and right-click the Web Content directory.
Select the New option from the pop-up menu.
Select the HTML/XHTML File option from the submenu.

The New HTML/XHTML File wizard opens, as shown in Figure 20.16.

Figure 20.16: New HTML/XHTML File wizard

The Folder information should be correct since you started the wizard from the Web Content directory. If the information in this field is different, make sure to correct it.

Enter ServerSelectionPage in the File Name entry field.
Click the Finish button.

The file is created and the Page Designer tool opens.

You might want to drag a cascading style sheet onto the page to make it look more professional. The instructions in Chapter 13 tell you in detail how to accomplish this.

First I want you to create a header for this page. In Page Designer on the Design page (Figure 20.17),

Figure 20.17: Creating the header

Erase the default text from the top of the page.
Right-click the page background.
Select the Insert option from the pop-up menu.
Select the Paragraph option from the submenu.
Select the Heading 1 option from the submenu.
In the area opened for the heading text, type in Select Server For Order Entry Application.

Now you need to add a form tag that allows you to send a request to invoke a servlet and pass parameter data to the server. Position the cursor underneath the header area.

Right-click the page background.
Select the Insert option from the pop-up menu.
Select the Form and Input Fields option from the submenu.
Select the Form option from the submenu.

A frame for a form is created on the page, as shown in Figure 20.18.

Figure 20.18: Page with form frame underneath the heading

Now you have to specify the program to call (your servlet), and you have to add the controls to enter the server name and a button to submit the request.

Right-click inside the form frame.
Select the Attributes option from the pop-up menu.

The Attributes [FORM] dialog appears in the bottom left area of the workbench, as shown in Figure 20.19.

Figure 20.19: Form attribute dialog

Click the push button to the right of the Action entry field.
Select the Servlet option on the pop-up menu.
Select the SelectiSeriesServer servlet from the list box.
Click the OK push button on the Servlet list dialog.

In Page Designer in the form frame,

Enter the following heading text for the selection entry field: Specify the server name here.

If you want to change the font or color of this text,

Select the text on the Design page.
Select the Format option on the workbench menu bar.
Select the Font option from the submenu.
Enter the required values in the Insert Font dialog box, as shown in Figure 20.20.

Figure 20.20: Changing font for heading text

You now need an entry field. I will explain how to add a combination box in which the user can select one of the available servers.

Inside the form frame,

Position the cursor after the text you just entered and enter a space.
Right-click at this position.
Select the Insert Input Fields option from the pop-up menu.
Select the List Box option from the submenu.

In the Insert List Box dialog (Figure 20.21),

Figure 20.21: Setting up the values for the combination box

Enter the list box name. This name has to be the parameter name you specified in the servlet to get the server name from. If you used the name I suggested, enter server_name ; otherwise use the name you picked.
Add your valid server names to the list; the sample shows the names for my environment.
Make the most used server the selected one, by specifying True in the Selected column.
Click the OK push button when you finish adding valid server names.

In the list box Attributes [SELECT] dialog on the bottom left of the workbench (Figure 20.22),

Figure 20.22: Changing the rows attribute of the list box to one

Change the Rows entry field to 1 .

Now you will add the push button. In Page Designer,

Position the cursor behind the list box you just added.
Press the Enter key twice to add some space.
Right-click inside the form frame at the bottom left corner.
Select the Insert Input Fields option.
Select the Submit button option.

The Insert Submit Button dialog (Figure 20.23) appears.

Figure 20.23: Insert Submit Button dialog

Enter submit in the Name entry field.
Enter Start Order Entry Application in the Label entry field.
Click the OK push button.

You can add more content to the page to make it look more attractive, as you feel fit. I added, for example, a graphic to the bottom. To perform that task, just drag and drop the file onto the page.

Have a look at your page by using the Page Designer Preview tab at the bottom of the design pane. My page is shown in Figure 20.24.

Figure 20.24: The finished Server Selection page in preview mode

Save the page.

Running the Application

In your Web project structure, find your Web page in the Web Content directory, as shown in Figure 20.25.

Figure 20.25: Selecting the ServerSelectionPage.html file

Right-click the ServerSelectionPage.html file.
Select the Run on server option.

Your page displays.

Select a server and press the Start Order Entry Application push button.

The WebFaced Order Entry Application displays. If you experience any problems, check the console messages. Does the text from your servlet display? If not, that is an indication that the servlet is not being invoked.

If you receive "System.out" text from the servlet, check that the invocation file name is correct.