• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Like this presentation? Why not share!

Class 21

on

  • 389 views

 

Statistics

Views

Total Views
389
Views on SlideShare
389
Embed Views
0

Actions

Likes
0
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Class 21 Class 21 Presentation Transcript

    • Class 21
    • Finals
      Final Project website is due:Midnight of Tuesday, 12/7/2010
      Compress the website into a .zip or .rarfile and email it to jilee@lagcc.cuny.edu.
      You will get a confirmation email as soon as the instructor checks that your submission is valid. If you don’t get a confirmation email within 8 hours of submission, contact instructor by phone.
      718-482-5419
    • Final Project Requirements
      Website
      at least 3 complete HTML pages
      navigation to other pages and back (menu)
      an external CSS file for styling elements
      a link to the Design Rationale Document
      a Spry element
      a form element
      Design Rationale Document
      Goal, target user or audience, deployment and update plan
    • Final Presentation
    • Forms
      Forms are used all over the Web to
      Accept information
      Provide interactivity
      Types of forms:
      Search form, Order form, Newsletter sign-up form, Survey form, Add to Cart form, and so on…
      Let’s look at an example! CLICK
    • Two Components of Using Forms
      1. The XHTML form
      -- the Web page user interface
      and
      2. The server-side processing
      Server-side processing works with the form data and sends e-mail, writes to a text file, updates a database, or performs some other type of processing on the server.
      6
    • XHTML Using Forms
      <form> tag
      Contains the form elements on a web page
      Container tag
      <input /> tag
      Configures a variety of form elements including text boxes, radio buttons, check boxes, and buttons
      Stand alone tag
      <textarea> tag
      Configures a scrolling text box
      Container tag
      <select> tag
      Configures a select box (drop down list)
      Container tag
      <option> tag
      Configures an option in the select box
      Container tag
      7
    • XHTML <form> element
      The form tag attributes:
      action
      Specifies the server-side program or script that will process your form data
      method
      get – default value, form data passed in URL
      post – more secure, form data passed in HTTP Entity Body
      name
      Identifies the form
      id
      Identifies the form
      8
    • XHTML<input /> Text box
      Accepts text information
      Attributes:
      type=“text”
      name
      id
      size
      maxlength
      value
      9
    • XHTML<input /> Password box
      Accepts text information that needs to be hidden as it is entered
      Attributes:
      type=“password”
      name
      id
      size
      maxlength
      value
      10
    • XHTML<input /> Check box
      Allows the user to select one or more of a group of predetermined items
      Attributes:
      type=“checkbox”
      name
      id
      checked
      value
      11
    • XHTML<input /> Radio Button
      Allows the user to select exactly one from a group of predetermined items
      Each radio button in a group is given the same name and a unique value
      Attributes:
      type=“radio”
      name
      id
      checked
      value
      12
    • XHTML<textarea> Scrolling Text Box
      Configures a scrolling text box
      Attributes:
      name
      id
      cols
      rows
      13
    • XHTML<select> Select List
      Configures a select list (along with <option> tags)
      Also known as: Select Box, Drop-Down List, Drop-Down Box, and Option Box.
      Allows the user to select one or more items from a list of predetermined choices.
      Attributes:
      name
      id
      size
      multiple
      14
    • XHTML<option> Options in a Select List
      Configures the options in a Select List
      Attributes:
      value
      selected
      15
    • XHTML<input /> Submit Button
      Submits the form information
      When clicked:
      Triggers the action method on the <form> tag
      Sends the form data (the name=value pair for each form element) to the web server.
      Attributes:
      type=“submit”
      name
      id
      value
      16
    • XHTML<input /> Reset Button
      Resets the form fields to their initial values
      Attributes:
      type=“reset”
      name
      id
      value
      17
    • XHTML<input /> Button
      Offers a flexible user interface
      There is no default action when the button is clicked
      Usually a JavaScript function is invoked when a button is clicked
      Attributes:
      type=“button”
      name
      id
      value
      18
    • XHTML<input /> Hidden form data
      This form control is not displayed on the Web page.
      Hidden form fields
      Can be accessed by both client-side and server-side scripting
      Sometimes used to contain information needed as the visitor moves from page to page.
      Attributes:
      type=“hidden”
      name
      id
      value
      19
    • Today’s Assignment
      Create a Contact page that has:
      • text-field
      • text-area
      • checkbox or radiobox
      • list/menu
      • Submit button
    • Demo Task