The Form Element Component Palette

Một phần của tài liệu web development with sas by example, 2nd edition (2006) (Trang 201 - 204)

The tool box displayed on the Form Elements tab at the top of the JSP/Servlet window has 12 controls available. The following icons are shown in Display 9.14 from left to right:

ƒ sas:Form

ƒ sas:CheckBox

ƒ sas:ChoiceBox

ƒ sas:ComboBoxView

Chapter 9 Developing Java Server-Side Applications with webAF Software 187

ƒ sas:ListBox

ƒ sas:ListBoxView

ƒ sas:PushButton

ƒ sas:Radio

ƒ sas:Hidden

ƒ sas:Password

ƒ sas:TextArea

ƒ sas:TextEntry

For a detailed description of these tools, including the attributes that can be specified for each, see http://support.sas.com/rnd/gendoc/bi/api/Components/taglibs/sas/

overview.html.

This example makes use of three of these form controls: TextEntry, Radio and PushButton. The webAF form controls are custom tags that are based on SAS TransformationBeans. TransformationBeans can be used to create HTML widgets, offering additional flexibility over the standard HTML form controls. The whole topic of InformationBeans in webAF software is described in detail later in this chapter. For the moment it is worth noting that the tag handler class for the sas:TextEntry tag is described in the tag library API under

com.sas.taglib.servlet.beans. TextEntryTag.

It is possible to drag and drop these controls either to the Visuals tab or the Source tab in the IDE. The former does not work very well for JavaServer Pages, since there is no HTML as such, so at this point just use the Source tab for code development. The Visuals tab is useful when formatting your components within a table, since it provides the table layout view.

Dragging a TextEntry control to the Source tab and dropping it on the page inserts the following custom tag, where the ID attribute specifies the name of the object:

<sas:TextEntry id="textEntry1" />

This is an okay start, but what we actually want looks more like this:

<sas:TextEntry id="input"

prolog="<strong>Enter a temperature and select a conversion type: </strong>"

size="8"

text="<%=temp%>" />

Naming the tag input is easier to remember than textEntry1. The prolog attribute specifies the text that will appear on the page before the text box. (As you might guess, there is also an epilog attribute for text to appear after the box.) The width of the text box is specified by the size attribute. Finally, the initial text to appear in the box is specified by the Java expression <%= temp %>, which is the value of the class variable temp defined in the scriptlet code. Initially this will be null, so the text box is empty.

Once an input temperature is specified, the resulting parameter value will be inserted into the box.

The other control required on the form is a radio button to select the conversion type.

Dropping a Radio widget on the Source tab results in the following:

<sas:Radio id="radio1" model="" />.

Again, not a bad start, but what is really needed is this:

<sas:Radio

id="convert"

selectedItem="<%=type%>">

Fahrenheit to Centigrade Centigrade to Fahrenheit </sas:Radio>

The object name is now convert rather than radio1. Two radio buttons are created, with the labels indicated; note that there are no quotation marks around the labels. The expression <%=type%> used as the value of the selectedItem attribute indicates that if the value of the type parameter is equal to one of the two labels (as it will be on the second and subsequent reference to the page), that button is checked. Otherwise, when the page is displayed, neither radio button would be checked and consequently it would be impossible to know which conversion had been executed. (It is probably a good idea to include a declaration for type at the top of the page, specifying a default value, to make sure that it is initialized.)

The other two controls on the page are a text box called output to display the result of the calculation and a push button to submit the form. Putting it all together results in the following page:

Example 9.3 JSP Temperature Conversion Calculator

<%-- JSP Temperature Conversion Calculator --%>

<%@ include file="header.html" %>

<% // Java scriptlet to calculate temperature String temp = request.getParameter("input");

String type = request.getParameter("convert");

String result = new String();

// make sure that we have values for the parameters if (null != temp && null != type)

{

double dt = new Double(temp).doubleValue();

if (type.charAt(0) == 'F')

result = String.valueOf(5.0 * (dt – 32.0)/9.0);

else if (type.charAt(0) == 'C')

result = String.valueOf((9.0 * dt) / 5.0 + 32.0);

}

%>

<h1 style="color: blue">Temperature Conversion Calculator</h1>

<sas:Form id="calculator" action="F2C.jsp" method="get">

<p><sas:TextEntry id="input"

prolog="<strong>Enter a temperature and select a conversion type: </strong>"

size="8" text="<%=temp%>" /></p>

Chapter 9 Developing Java Server-Side Applications with webAF Software 189

<p><sas:Radio

id="convert" selectedItem="<%=type%>">

Fahrenheit to Centigrade Centigrade to Fahrenheit </sas:Radio></p>

<p><sas:TextEntry id="output"

prolog="<strong>Result: </strong>"

size="8" text="<%=result%>" /></p>

<sas:PushButton

id="submit" text="Submit" />

</sas:Form>

<%@ include file="footer.html" %>

The requested action (when the Submit button is clicked) is to redisplay the page, with the parameter values appended to the URL. The form’s method attribute has been set to get so that the parameters will be visible; if this is not desired, specify post instead.

This program was constructed just by fitting together the three pieces described

previously. Referencing this page in a browser results in the following page (don’t forget to start the server!):

Một phần của tài liệu web development with sas by example, 2nd edition (2006) (Trang 201 - 204)

Tải bản đầy đủ (PDF)

(361 trang)