multimedia and the world wide web
Skip this Video
Download Presentation
Multimedia and the World Wide Web

Loading in 2 Seconds...

play fullscreen
1 / 26

Multimedia and the World Wide Web - PowerPoint PPT Presentation

  • Uploaded on

Multimedia and the World Wide Web. HCI 201 Lecture Notes #5B. What will we learn today?. How does form work What’s in <form> Form elements Button Checkbox Radio Text Textarea Hidden. Case Study 4.

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

PowerPoint Slideshow about 'Multimedia and the World Wide Web' - josiah-evans

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
multimedia and the world wide web

Multimedia and the World Wide Web

HCI 201 Lecture Notes #5B

what will we learn today
What will we learn today?
  • How does form work
  • What’s in
  • Form elements
    • Button
    • Checkbox
    • Radio
    • Text
    • Textarea
    • Hidden


case study 4
Case Study 4

Lisa Jacobs, the director of customer support for Jackson Electronics, would like to have a page for customer registration. Instead of having to fill out and mail back the registration card in the product package, customers can now do it online. The registration information will be sent via emails to Lisa’s assistant.

As you have guessed, Lisa asks us to create this registration page for her company.


how does form collect information
How does form collect information
  • The user retrieves the form page from the web server.
  • The user sends the filled out form back to the sever. A CGI script running on the server retrieves and saves user’s input.
  • The CGI script may send some feedback to the user as confirmation.





cgi scripts
CGI scripts
  • What’s a CGI script?Common Gateway Interface script is any program or sets of commands that performs tasks with the data it retrieves from the web page.
  • Present static information  interact with readers.
  • CGI scripts made it possible for us to
    • Maintain online database
    • Publish catalogues for online purchases
    • Dynamically present information based on users’ profiles
    • Record the number of times a web page has been accessed
  • CGI scripts can be written in different programming languages
    • Visual Basic, JavaScript, ASP, C/C++, Perl, etc.


what s in form
What’s in
  • Function:

Contains various controls/fields to collect inputs

  • Attributes:

action, method, name, etc.

  • End tag:

, never omitted.

  • Contains: form controls
  • Used in : body_content


what s in form1
What’s in
  • One page can have several s, one after another. (You cannot nest one form inside another)
  • action

- Gives the URL of the CGI script that will retrieve and process the form’s data.

Create an email that looks like this:“FirstName=Andy&LastName=Davids&Address=634+Wabash+Ave&City=Chicago&State=IL&Date=Aug%2Fl10%2F2004&Notes=…”


what s in form2
What’s in
  • Method

- Tells the script how to retrieve the data from the form- get packages the form data by appending it to the end of the URL specified in action.Sever retrieves the data from the URL for the script program to process.

- post sends form data in a separate data stream, allowing the server to retrieve data from name-value pairs (standard input). It is more flexible (any info.) and safer (data will not be truncated).


form elements
Form elements
  • Most commonly used form controls
    • Text boxes for (short) text and numerical entries
    • Radio buttons to select a single option from a predefined group of (usually short) items
    • Check boxes to select any number of options from a predefined group of items
    • Selection lists for long lists of options (dropdown list, single selection list, multiple selection list)
    • Text areas for extended entries that might include several lines of text.
    • Buttons perform certain tasks upon being clicked (button, submit, reset)


creating a form
Creating a form
  • Decide what information will be collected by this form
  • Decide what form controls should be used

Short/long entry, single/multiple selections, limited choices, open answers, etc.

  • Decide the positions of these controls on your form

Top-down, left-to-tight, form conventions, alignment.