5
Filling Out Forms for Data Entry and Navigation

Each section of this document presents a different topic. These sections include:

5.1 Introduction

Forms provide the basic building blocks for user interactions. Forms for phones and PDAs are fairly similar, except in form factor. Like HTML forms, forms in mobile devices are used for passing name-value parameters to the server. Multiple form items can be laid out on the device screen, if supported. Therefore, a user may populate a form item in an arbitrary order. Certain format restrictions can be specified on a form item to ensure the type safety and validity of form fields. For example, it is possible to specify a restriction of five digits for US postal codes. However, most of the validation should occur on the server side. This constraint is due to the limited resources on the devices. On a voice browser, every thing must be processed by the voice gateway, which enables rich validation and exception handling at the markup language level.

5.2 Basic User Interaction

5.2.1 SimpleForm

SimpleForm is similar to HTML form, which provides an arbitrary collection of SimpleFormItem and SimpleFormSelect as a single entity. SimpleFormSelect may be used to display list, radio buttons or checkbox controls. Form has SimpleTitle as its child, and if specified, will appear as the Title of the form. SimpleForm along with SimpleBind can trigger form processing in several ways; multiple tasks can be executed upon form submission.

5.2.2 SimpleFormItem

SimpleFormItem is the equivalent of a text field, text area, password field and hidden field for desktop browsers. The type of item may be specified using the display mode attribute. It may take text field, text area, noecho or hidden. SimpleFormItem can be used to obtain input from a user. This element presents a prompt, and waits for input from the user. The content of this element, which is in parsable character format, specifies default values for the form item. For example, a login screen and guest book screen may appear as in the following example.

5.2.2.1 FormExample.xml

<?xml version = "1.0" encoding = "UTF-8" standalone="yes" ?>
<!DOCTYPE SimpleResult PUBLIC "-//ORACLE//DTD SimpleResult 1.1//EN" 
"http://xmlns.oracle.com/ias/dtds/SimpleResult_1_1_0.dtd">
<SimpleResult>
 <SimpleContainer>
  <SimpleForm target="login.jsp" method="post">
   <SimpleFormItem name="userName">User Name:</SimpleFormItem>
   <SimpleFormItem name="password" 
displaymode="noecho">Password:</SimpleFormItem>
  </SimpleForm>
 </SimpleContainer>
</SimpleResult>

Figure 5-1 Results of FormExample.xml example

Text description of the illustration xml5-1.gif

5.2.2.2 GuestBook.xml

<?xml version = "1.0" encoding = "UTF-8" standalone="yes" ?>
<!DOCTYPE SimpleResult PUBLIC "-//ORACLE//DTD SimpleResult 1.1//EN" 
"http://xmlns.oracle.com/ias/dtds/SimpleResult_1_1_0.dtd">
<SimpleResult>
 <SimpleContainer>
  <SimpleForm target="sendMail.jsp" method="post">
   <SimpleTitle>Thanks for signing my guestbook.</SimpleTitle>
   <SimpleFormItem name="Name">Name:</SimpleFormItem>
   <SimpleFormItem name="message" 
displaymode="textarea">Message:</SimpleFormItem>
  </SimpleForm>
 </SimpleContainer>
</SimpleResult>

Figure 5-2 Results of GuestBook.xml example

Text description of the illustration xml5-2.gif

5.3 Complete User Forms

5.3.1 SimpleFormSelect, SimpleFormOption, and SimpleOptGroup

These elements display a selected option list. It can display drop down list, checkbox and radio button, using the display mode attribute. Checkboxes or option lists may allow single selection or multiple selections using the multiple attribute. The items to be displayed are abstracted by the SimpleFormOption element. SimpleOptGroup groups SimpleFormOption elements into a hierarchy. It is useful for small screen devices, where long list of options cannot be esthetically presented in the user interfaces. The content of SimpleFormOption element is parsable character data, which specifies default values for the form item. See the following example for usage.

5.3.2 Profile.xml

<?xml version = "1.0" encoding = "UTF-8" standalone="yes" ?>
<!DOCTYPE SimpleResult PUBLIC "-//ORACLE//DTD SimpleResult 1.1//EN" 
"http://xmlns.oracle.com/ias/dtds/SimpleResult_1_1_0.dtd">
<SimpleResult>
 <SimpleContainer>
  <SimpleForm name="employeeinfo" target="process.jsp">
   <SimpleTitle>Your Profile</SimpleTitle>
   <SimpleFormItem name="homepage" default="http://">Homepage</SimpleFormItem>
   <SimpleFormSelect name="skills" displaymode="checkbox" multiple="true">
    <SimpleTitle>Skills</SimpleTitle>
    <SimpleFormOption value="java">Java</SimpleFormOption>
    <SimpleFormOption value="xml">XML</SimpleFormOption>
    <SimpleFormOption value="sql">SQL</SimpleFormOption>
   </SimpleFormSelect>
   <SimpleFormSelect name="nerd" displaymode="checkbox">
    <SimpleTitle>Addicted to Java?</SimpleTitle>
    <SimpleFormOption value="yes">Yes</SimpleFormOption>
    <SimpleFormOption value="no">No</SimpleFormOption>
   </SimpleFormSelect>
   <SimpleFormSelect name="location" displaymode="list">
    <SimpleTitle>Location</SimpleTitle>
    <SimpleFormOption value="Redwood Shores_CA">HQ Redwood 
Shores,CA</SimpleFormOption>
    <SimpleFormOption value="Nashua_NH">NEDC Nashua, NH</SimpleFormOption>
    <SimpleFormOption value="SanFrancisco_CA">SanFrancisco, 
CA</SimpleFormOption>
    <SimpleFormOption value="NewYork,NY">NewYork, NY</SimpleFormOption>
   </SimpleFormSelect>
   </SimpleForm>
  </SimpleContainer>
</SimpleResult>

Figure 5-3 Results of Profile.xml example

Text description of the illustration xml5-3.gif

5.4 Enhancing Voice

5.4.1 SimpleGrammer, SimpleValue and SimpleDTMF

SimpleGrammar-- The SimpleGrammar tag provides a customized speech recognition grammar. For further details on the use of SimpleGrammar see Section 4.3.2.4, "SimpleGrammar".

SimpleValue--The SimpleValue tag is a placeholder for dynamic information that is not known until runtime. This element is valuable for processing multiple cards within one deck and capturing client-side data validation.

SimpleDTMF--This is a keyboard binding number that is used to process input. In the example below, the formItem ZipInput would pass only 232 to the target and nothing else unless there was an error or long pause.

<?xml version = "1.0" encoding = "UTF-8" standalone="yes" ?>
<!DOCTYPE SimpleResult PUBLIC "-//ORACLE//DTD SimpleResult 1.1//EN" 
"http://xmlns.oracle.com/ias/dtds/SimpleResult_1_1_0.dtd">
<SimpleResult>
 <SimpleContainer>
  <SimpleForm name="Starting" target="test2a.jsp">
   <SimpleFormItem name="addrInput">
    simple grammar test, please say oracle or san mateo
   <SimpleGrammar>
    oracle {bridge}|san mateo{foster city}
   </SimpleGrammar>
   </SimpleFormItem>
   <SimpleFormItem name="zipInput">
    <SimpleDTMF> 95 {232} </SimpleDTMF>
     Simple DTMF test, please press 95
   </SimpleFormItem>
  </SimpleForm>
 </SimpleContainer>
</SimpleResult>

5.4.2 Recommendation for Voice Forms

So far we have written the form for the small screen devices which are similar to the following form.<?xml version = "1.0" encoding = "UTF-8" standalone="yes" ?>

<!DOCTYPE SimpleResult PUBLIC "-//ORACLE//DTD SimpleResult 1.1//EN" 
"http://xmlns.oracle.com/ias/dtds/SimpleResult_1_1_0.dtd">
<SimpleResult>
 <SimpleContainer>
  <SimpleForm target="guess.jsp">
   <SimpleFormItem name="guess">
    <SimpleTitle>
    I am thinking of a number between 1 and 100.
    What is your first guess?
    </SimpleTitle>
   </SimpleFormItem>
  </SimpleForm>
 </SimpleContainer>
</SimpleResult>

This example would work well for a small screen device. However, this is not sufficient for spoken input. Speech recognition works only when there is a very narrowly prescribed vocabulary to listen for. Descriptions of such vocabularies are called speech-recognition grammars. <SimpleMenu>s and <SimpleFormSelect>s provide such grammars with their lists of <SimpleMenuItem>s and <SimpleFormOption>s. However, in examples such as the one above, the system should be listening for an arbitrary number. This is indicated by the type attribute of <SimpleFormItem>, as follows.

<?xml version = "1.0" encoding = "UTF-8" standalone="yes" ?>
<!DOCTYPE SimpleResult PUBLIC "-//ORACLE//DTD SimpleResult 1.1//EN" 
"http://xmlns.oracle.com/ias/dtds/SimpleResult_1_1_0.dtd">
<SimpleResult>
 <SimpleContainer>
  <SimpleForm target="guess.jsp">
   <SimpleFormItem name="guess" type="number">
    <SimpleTitle>
    I am thinking of a number between 1 and 100.
    What is your first guess?
    </SimpleTitle>
   </SimpleFormItem>
  </SimpleForm>
 </SimpleContainer>
</SimpleResult>

Setting type="number" tells the system to listen for any utterance that corresponds to a spoken number, if such an utterance is heard, then assigns the corresponding number to the identifier "guess". In addition to number, the values boolean, digits, date, time, currency, and phone also specify vocabularies to listen for. Besides specifying the type attribute, the developer can enhance the voice features by observing the following guidelines:

The voice experience can be enhanced with prerecorded audio using the <SimpleAudio> element.
As confirmation, echo the recognized utterance and allow the user to cancel if an input has been misrecognized.
Always provide context-sensitive help.
As necessary, use the deviceclass attribute to tailor audio and text messages to voice (but use this attribute sparingly, as it tends to obfuscate the markup).
Always provide the user the option of continuing in a service by "moving forward" -- providing an appropriate command leading to the place the user wants to go -- rather than forcing them to "back out" using cancel.
Provide special event handlers for recognition failures (noinput, nomatch) and Internet fetch failures (error.badfetch) where appropriate.

The following example improves the user experience through the implementation of these guidelines.

<?xml version = "1.0" encoding = "UTF-8" standalone="yes" ?>
<!DOCTYPE SimpleResult PUBLIC "-//ORACLE//DTD SimpleResult 1.1//EN" 
"http://xmlns.oracle.com/ias/dtds/SimpleResult_1_1_0.dtd">
<SimpleResult>
 <SimpleContainer>
  <SimpleForm target="tipcalc.jsp">
   <SimpleFormItem name="howmuch" type="currency">How much is the bill?
   </SimpleFormItem>
   <SimpleFormItem name="howmany" format="N*" type="number">
   How many are in your party?
    <SimpleCatch type="cancel">Canceling.
     <SimpleClear name="howmuch"/>
    </SimpleCatch>
   </SimpleFormItem>
   <SimpleFormSelect name="howbig" deviceclass="microbrowser pdabrowser 
pcbrowser micromessenger messenger">
    <SimpleTitle>How big do you want your tip to be?</SimpleTitle>
    <SimpleFormOption value="10">small (10%)</SimpleFormOption>
    <SimpleFormOption value="15">medium (15%)</SimpleFormOption>
    <SimpleFormOption value="20">large (20%)</SimpleFormOption>
   </SimpleFormSelect>
   <SimpleFormSelect name="howbig" deviceclass="voice" autoprompt="false">
    <SimpleTitle>
     How big do you want your tip to be?
     For 'ten percent' say 'small',
     for 'fifteen percent' say 'medium', 
     for 'twenty percent' say 'large'.
    </SimpleTitle>
    <SimpleFormOption value="10">small</SimpleFormOption>
    <SimpleFormOption value="15">medium</SimpleFormOption> 
    <SimpleFormOption value="20">large</SimpleFormOption>
    <SimpleCatch type="nomatch">Please say that again</SimpleCatch>
    <SimpleCatch type="cancel">Canceling.
     <SimpleClear name="howmuch"/>
     <SimpleClear name="howmany"/>
     <SimpleClear name="howbig"/>
    </SimpleCatch>
   </SimpleFormSelect> 
  </SimpleForm>
 </SimpleContainer>
</SimpleResult>

5 Filling Out Forms for Data Entry and Navigation