Pages

Wednesday, February 22, 2012

Advanced Tables, Forms and HTML Day 1

  • Content in title tags are what show up at the top of the browser as the title (ie. <title>Forms Practice</title>
          The top of the Tab of the browser will say Forms Practice. 
  • Inside the computer's public folders, there should be a public HTML folder by the Professor. All those documents are viewable by anyone. 
  • When you fill out a form, the information goes from the HTML form to a CGI Script. From there, the information can go to update a database, go to an e-mail address, create an e-commerce transaction, or update another website (such as C-Tools or Blackboard). 
           Radio Buttons only allow one choice on a form.
           Check Boxes allow for more than one selection.
           Text Areas allow for large areas of space for people to add text.
  • Form tag needs several values. 
Example:

<form method="post"
action="http://www-personal.umd.umich.edu/cgi-bin/htmail/shahnazk@umd.umich.edu">


<div align="center"><b>Sample Form</b></div>


This will look like:

Practice with Forms

Sample Form
  
  
   
       
_____________________________________________________

       <p>2. Please enter your e-mail address.
       <input type="text" name="from" value="Your e-mail here">

       The value puts the quoted words into the box on the form.


       <p>3. Would you like to be added to our mailing list?
       <input type="radio" name="3_MailingList"
       You shouldn't have space, put an underscore to make the code work.

_____________________________________________________

With these tags, you can build a form:

<html>
  <head>
    <title>Forms Practice</title>
  </head>

<body>
<h1>Practice with Forms</h1>
<!--BEGINNING OF FORM-->
<form method="post"
action="http://www-personal.umd.umich.edu/cgi-bin/htmail/const@umd.umich.edu">

<p>1. Please enter your first name
<input type="text" />
</p>
<input type="submit" />

</body>
</html>

This will look like:

Practice with Forms

1. Please enter your first name


______________________________________________________

This is an almost final form:



These are the sequence of codes used to create it all:
<html>
  <head>
    <title>Forms Practice</title>
  </head>

<body>


<h1>Practice with Forms</h1>

<!--BEGINNING OF FORM-->

<form method="post"
action="http://www-personal.umd.umich.edu/cgi-bin/htmail/const@umd.umich.edu">


<p>1. Please enter your first name.
<input type="text"
 name="1. First Name" />
</p>

<p>2. Please enter your e-mail address.
 <input type="text" name="from" value="Your e-mail here">

<!--The line break after the question allows the circle for people to check
to have the word Yes.-->
<p>3. Would you like to be added to our mailing list?
<br />
Yes
 <input type="radio" name="3_MailingList" value="Y"
  checked="checked"/>
No
 <input type="radio" name=3_Mailing List" value="N"/>

</p>

<br />
<input type="submit" />

</body>
</html>






0 comments:

Post a Comment