• No results found

Creating Forms with the AWT

● Checking for Errors on the Client Side ● Adding Context-Sensitive Help

● Creating Dynamic Forms

● Loading Another URL from an Applet ● Creating Image Maps with Hot Spots

Smarter Forms

In the beginning, Web pages were not very lively. You could read information, click certain words and pictures, and view other unlively pages. Then, the forms interface came along and added some degree of interaction with a page. You were able to enter data and then click a button and send your information to a server, which would analyze what you sent and return the results. Unfortunately, these forms were also lacking a certain "lively" quality. All the error checking was left up to the server, as was any other form of interaction such as context-sensitive help. Java enables you to spice up your old Web forms. You can perform error checking before you ever send data to the server, drastically improving response time to the user and cutting down on server usage. You can also add context-sensitive help. You can even create dynamic forms that change depending on the other information added.

Creating Forms with the AWT

Java's AWT toolkit contains a set of GUI components that are very useful for constructing forms suitable for a Web page. All the form components provided in HTML have equivalent AWT components, so you can simulate any existing HTML form.

Listing 7.1 shows just such a form, a query entry form for the Lycos Web searching engine (http://www.lycos.com). It enables you to enter the keywords to search for, and some other search parameters, and then it sends the query to the Lycos server just as if you had used, the Lycos page.

Note

Chapter 7 -- Creating Smarter Forms

This applet is meant for demonstration purposes only. While it will function with the real Lycos server, it does not display the advertisements from the normal Lycos search page. Although you may consider this a plus, it really isn't.

Advertisements keep companies like Lycos in business and allow them to provide these wonderful services to you at no cost. Please do not use this applet or any other program to thwart a company's advertising displays. It hurts everyone in the long run.

Listing 7.1 Source Code for LycosForm.java

import java.awt.*; import java.applet.*; import java.net.*; import java.util.*;

// This applet demonstrates the use of AWT components as an // alternative to the HTML forms interface. It creates a query // for the Lycos search engine and displays the results using // the showDocument method.

public class LycosForm extends Applet {

protected TextField queryString; // the terms to search for protected Choice matchTerms; // how many terms to match String matchTermValues[] = { "and", "or", "2", "3", "4", "5", "6", "7" };

protected Choice matchStrength; // how good a match

String matchStrengthValues[] = { ".1", ".3", ".5", ".7", ".9" }; protected Choice resultCount; // how many matches to show

String resultCountValues[] = { "10", "20", "30", "40" };

protected Choice resultType; // how much information to display String resultTypeValues[] = { "terse", "standard", "verbose" }; protected Button searchButton; // perform the query

public void init() {

// Arrange the query form as a 3 horizontal grid elements setLayout(new GridLayout(3, 0));

// Create the element with the query string and submit button add(createQueryPanel());

Chapter 7 -- Creating Smarter Forms

add(createSearchOptionsPanel());

// Create the element containing display options add(createDisplayOptionsPanel());

}

The AWT layout managers provide a reasonable way to place components on the screen without putting them in fixed positions. This allows your applet to adapt to different screen sizes. Unfortunately, it is often difficult to arrange the components the way you want them. The GridBagLayout class provides the most flexible way to arrange components, but it is often rather cumbersome to use. As an alternative to the GridBagLayout class, or even in conjunction with it, you can use different panels to group your components, nesting some panels within others. The LycosQuery class uses this technique. It creates a main panel that uses a grid layout with three rows. The first row is another panel that uses a flow layout, while the last two rows use two-column grid layouts.

Tip

Grid layouts expand components to fill all available space. If you want to maximize a component's size, the grid layout is a good choice. Flow layouts, on the other hand, don't adjust the component size, so they tend to use the minimum required space. Grid bag layouts let you choose either of these options.

Listing 7.1 Source Code for LycosForm.java (continued)

// createQueryPanel creates a panel containing a text field

// for query terms and the button used to send the query to Lycos protected Panel createQueryPanel()

{

Panel panel = rEw Panel();

panel.setLayout(new FlowLayout(FlowLayout.LEFT)); panel.add(new Label("Query: "));

queryString = new TextField(30); panel.add(queryString);

searchButton = new Button("Search"); panel.add(searchButton);

return panel; }

// createSearchOptionsPanel creates a panel containing the // choices for the number of terms to match and the strength // of the matches.

Chapter 7 -- Creating Smarter Forms

protected Panel createSearchOptionsPanel() {

Panel panel = new Panel();

panel.setLayout(new GridLayout(0, 3)); panel.add(new Label("Search Options:")); matchTerms = new Choice();

matchTerms.addItem("match all terms (AND)"); matchTerms.addItem("match any term (OR)"); matchTerms.addItem("match 2 terms"); matchTerms.addItem("match 3 terms"); matchTerms.addItem("match 4 terms"); matchTerms.addItem("match 5 terms"); matchTerms.addItem("match 6 terms"); matchTerms.addItem("match 7 terms");

matchTerms.select(1); // default on the OR option panel.add(matchTerms);

matchStrength = new Choice();

matchStrength.addItem("loose match"); matchStrength.addItem("fair match"); matchStrength.addItem("good match"); matchStrength.addItem("close match"); matchStrength.addItem("strong match");

matchStrength.select(0); // default on the loose match panel.add(matchStrength);

return panel; }

// createDisplayOptionsPanel creates a panel containing the choices for // the number of matches returned and the amount of detail to return. protected Panel createDisplayOptionsPanel()

{

Panel panel = new Panel();

panel.setLayout(new GridLayout(0, 3)); panel.add(new Label("Display Options:")); resultCount = new Choice();

resultCount.addItem("10 results per page"); resultCount.addItem("20 results per page"); resultCount.addItem("30 results per page"); resultCount.addItem("40 results per page");

resultCount.select(0); // Default to 10 results per page panel.add(resultCount);

resultType = new Choice();

Chapter 7 -- Creating Smarter Forms

resultType.addItem("Standard Results"); resultType.addItem("Detailed Results");

resultType.select(1); // Default to Standard Results panel.add(resultType);

return panel; }

The URLQuery class used in this next part of the LycosQuery class was introduced in the section, "Performing a Query

with GET," in Chapter 6, "Communicating with a Web Server." It allows you to create an HTTP query from an URL and a properties table containing the query parameters. It would be nice if you could examine the data coming back from the query and still let the browser display the actual HTML codes returned, but on most browsers you can't. You can either examine the data coming back and display it yourself from the Java program, or use showDocument to display the data directly.

Listing 7.1 Source Code for LycosForm.java (continued)

// sendRequest uses the URLGet class to create a CGI Query to Lycos. protected void sendRequest()

{

Properties queryProps = new Properties();

queryProps.put("query", queryString.getText()); queryProps.put("matchmode", matchTermValues[ matchTerms.getSelectedIndex()]); queryProps.put("minscore", matchStrengthValues[ matchStrength.getSelectedIndex()]); queryProps.put("maxhits", resultCountValues[ resultCount.getSelectedIndex()]); queryProps.put("terse", resultTypeValues[ resultType.getSelectedIndex()]); try {

URL lycosURL = new URL(

"http://www.lycos.com/cgi-bin/pursuit");

URL fullURL = URLQuery.createQuery(lycosURL, queryProps); getAppletContext().showDocument(fullURL); } catch (Exception e) { e.printStackTrace(); } } file:///E|/Java%20Professor/Hacking%20Java%20Professional%20Resource%20Kit/ch7.htm (5 of 27) [8/14/02 10:52:50 PM]

Chapter 7 -- Creating Smarter Forms

public boolean action(Event evt, Object whichAction) {

// If someone pressed the button, send the request if (evt.target == searchButton) { sendRequest(); return true; } return false; } }

Figure 7.1 shows the original version of the Lycos query form.

Figure 7.1 : The Lycos search engine is a popular Web search tool.

Figure 7.2 shows a mimic of an HTML form.

Figure 7.2 : You can mimic any HTML form in Java.

You may be wondering why you should go through the trouble of creating a Java applet that presents a form when it is easier to define one in HTML. If you are simply presenting a form, with no help facility and no error checking, go ahead and do it in HTML. The real advantage of Java comes when you need to do things beyond the basic form facilities in HTML.