HTML

UNIT 9 FORMS

Competences: To insert a form in the web page

Contents: Different kinds of input

What are HTML Forms?

Forms are elements in the web page that allow the user to enter information.
HTML Forms are used to insert different kinds of user input (numbers, words, text ..).
A form is defined by the <form> tag.
The information must be sent to another file written in a programming language, that must be able to modify or to conserve the introduced information.

Look at the forms for different kinds of input:

Our HTML pages aren't interactive ones, so we must learn something else about programming language to use these forms! Perhaps the next year??

The code of some Form

Code	Output	Some examples in the w3schools site
This is an input type text <input type="text" />	This is an input type text	Input type text
This is an input type radio <input type="radio" />	This is an input type radio	Input type radio
This is an input type checkbox <input type="checkbox" />	This is an input type checkbox	Input type checkbox
This is a select menu <select> <option>A</option> <option>B</option> </select>	This is a select menu	Select
This is an input type submit <input type="submit" />	This is an input type submit	Type text and submit Type radio and submit Type checkbox and submit

Interact with a PHP page!

Open your file index.htm (or page2.htm, or page3.htm ...) and insert a form in it in this way:

<html>
<body>
........... 
 
 <form action="http://www.openfisica.com/lezioni_html/inglese/calcola.php" method="post">
 Insert two numbers: 
 <input type="text" name="a" /> 
 <input type="text" name="b" />
 <input type="submit" />
 </form> 
 ..........
</body>
</html>

Pay attention! In the form tag, the action attribute sends the data to the file calcola.php.

You have to put the names (a and b) of the variables in the input tags.

Save the file in your local site and test it.

Upload the file in the remote site and test it.

Write a message in the forum "Forms" to inform that your page is ready!

Ludovica Battista

Back to index| Previous | Next