Chapter 10' Forms Handling User Input

1
Chapter 10. Forms Handling User Input

• Form and Function
• Selecting one of a set of radio buttons
• Choosing one or more checkboxes
• Using a list box to select an element from a
  predefined list
• Entering free-flowing text into a text field
• Users activate a submission button
• Send the data to the server hosting the Web page
• Send the data to the specified e-mail address
• Figure 10.1
• Change current e-mail address to yours

2
Handling Electronic Mail

• namePattiToadgenderEemailpattit_at_toadhall.com
  
• Parsing the data
• Takes time
• Need to follow the rules
• Store the data for later use
• Use the POST method instead of the GET method to
  send data using e-mail

3
ltFORMgtcontents of the formlt/FORMgt

• action and method are required
• action
• Points to the application that will process the
  data captured by the form
• Send the data to the server and process the data
  by a CGI script
• ltFORM actionhttp//www.bugsbeewee.com/cgi-bin/bu
  gorder.cgi methodPOSTgt
• E-mail the data to e-mail address
• ltFORM actionmailtokjeong_at_ou.edu methodPOSTgt

4

• target
• Allows the Web weaver to direct the return data
  from a script to a different window or frame than
  the one that originally contained the form
• ltFORM targetbuggyframe actionhttp//www.bugsb
  eewee.com/cgi-bin/bugorder.cgi methodPOSTgt
• accept-charset
• ltFORM accept-charsetISO-2022-KR
  actionhttp//www.bugsbeewee.com/cgi-bin/bugorder
  .cgi methodPOSTgt
• style
• Compare Figure 10.5 to Figure 10.6

5

• class
• name
• title
• enctype
• ltFORM enctypetext/plain
• actionmailtoscarab_at_bugsbeewee.com
• methodPOSTgt for general process and default
• ltFORM enctypemultipart/form-data
• actionmailtoscarab_at_bugsbeewee.com
• methodPOSTgt for file process

6

• ltINPUTgt
• Creates an input element (control) within a form
• Table 10.1
• name
• namevalue
• Make the name meaningful
• Use lowercase letters for the name
• Start the name with an alphabetic character
• Make the name continuous
• Use the underscore between the two words
• Avoid special characters
• type
• Defines which type of control the form will
  provide for the user

7

• typeTEXT
• Text-entry fields
• The default text window is 20 characters wide
• Figure 10.7
• size
• Specifies the length of the text-entry field
• Figure 10.8
• maxlength
• Limits the actual number of characters
• Figure 10.9
• value
• Assign a default value in the text box
• Figure 10.10

8

• typePASSWORD
• To protect the data from seeing
• Displaying when you type
• Data are not protected when sent to the server
• The data can be intercepted and read
• Figure 10.11
• typeFILE
• Sends a file back along with the form data
• It automatically generates a working Browse
  button
• Figure 10.12
• typeCHECKBOX
• Can select several checkboxes
• Figure 10.14
• checked for checkboxes
• Figure 10.15

9

• typeRADIO
• Selects only one option from a list
• Figure 10.16
• checked for radio
• Figure 10.17
• typeRESET
• Provides a control that causes the browser to
  reset to the original status
• Figure 10.18
• typeSUBMIT
• Starts the process of the browser encoding and
  sending the information to the server or invokes
  the browsers associated e-mail program
• Multiple submit controls
• Use name and value pairs
• Figure 10.19

10

• Graphical Buttons
• typeIMAGE
• The browser sends an X, Y coordinate pair
  representing the location of the mouse pointer,
  associated with the name attribute
• Figure 10.20
• bfly.x84bfly.y27
• Hidden Data Fields
• typeHIDDEN
• When you want to send CGI script data that you
  dont want the user to be able to manipulate or
  even see
• ltINPUT typeHIDDEN namemailto
  valuekjeong_at_ou.edugt

11
ltTEXTAREAgtoptional text stringlt/TEXTAREAgt

• Creates an area for multi-line text input box
• Figure 10.21
• rows and cols
• The rows and cols attributes define the initial
  size of the text-input area
• Figure 10.22

12

• wrap (Figure 10.23)
• Causes the browser to break lines on word
  boundaries as close to the right margin as
  possible and continue the text on the following
  line
• wrapVIRTUAL
• Causes the browser to break the input lines at
  word boundaries on the users screen
• Only those CRLFs that the user actually entered
  will be in the text stream
• wrapPHYSICAL
• Same as VIRTUAL
• The actual CRLFs are added to the text as if the
  user typed them
• wrapOFF
• Default processing
• The only CRLFs either shown or sent are those
  actually entered by the user