Using Entities & Creating Forms
Jill R. Sommer
Institute for Applied Linguistics
Kent State University
Using Entities
Many symbols are frequently published that do not appear on the standard English keyboard, such as the cent and copyright symbols. In HTML, these are called character entities.
Character entity symbols also include language diacritical marks and mathematical symbols.
Using Entities
HTML enables you to include these symbols in a Web page by typing an ampersand symbol (&), followed by a keyword or number, and then a semi-colon (;)
When the browser sees this character entity value, it replaces it with the appropriate symbol.
Using Entities
For example, to have a browser display the copyright symbol (©), you need to type © or © in your HTML file.
The numerical values are taken from the ASCII values for the various characters, but they can be difficult to remember so named character entity values were created to make it easier for Web page authors to use.
Using Entities
The most important ones to remember are: (non-breaking space)& (ampersand)and " (quotation mark)
If you use an editor, it will most likely convert your diacritical marks.
For Specific Entities, See:
http://www.htmlhelp.com/reference/html40/entities/latin1.html
http://www.htmlhelp.com/reference/html40/entities/symbols.html
http://www.htmlhelp.com/reference/html40/entities/special.html
Form Basics
Forms allow users to sign guest books, answer surveys, register for information, order merchandise online, etc.
Forms used to run using Common Gateway Interface (CGI) programs, but now forms can be handled using technologies like Active Server Pages (ASP), JavaServer Pages (JSP), or PHP (a widely-used general-purpose scripting language that is especially suited for Web development and can be embedded into HTML)
Form Basics
Forms are used to transfer information. Forms have two functions: to allow the user
to send information to the server and to allow the server to track the user.
Forms are useless on their own. They need to interact with a processing program on the back end or server that allows us to implement the functionality of the form.
Form Basics
A Web page form can consist of many different form elements. These form elements can include elements such as text fields, radio buttons, drop-down lists, and submit and reset buttons
The beginning and end of a form is noted by a set of <form> tags. All form elements must appear within these tags to belong to the form.
Form Basics
The <form> tag also includes attributes that you can use to specify how and where the form data gets passed (action, method, and enctype).
The two attributes that you use to handle the form data are the action and method attributes. They determine how the form data is sent.
Form Basics: Action
The action attribute can be set to the URL of an application that can process the form data.
The server can also route the form data to an e-mail address. This is accomplished by setting the action attribute to an e-mail address: (action="mailto:[email protected]")
For this to work, you need to set the method attribute to post (method="post")
Form Basics: Method
The method attribute defines how the form data gets passed to the program specified in the action attribute.
The get method tacks data onto the end of the URL to pass it to the server. The get method can be problematic if the browser limits how long the URL line can be.
The post method includes the form data as part of the HTTP request.
Form Basics: Method
If the method attribute is missing from the <form> tag, the get method is used to submit the form data.
Using the get method, the form data is attached to the end of the URL line. A question mark (?) separates the actual URL address and the name/value pairs. Each name/value pair is separated from the other with the ampersand symbol (&)
Form Basics: Method
The post method for passing data to the program is more common and more browser compatible.
The post method sends all the form element‘s names and values to the standard input channel. The program can then access this data and process it.
The post method can handle large amounts of data.
Form Basics: Enctype
The default enctype attribute is application/x-www.form.urlencoded.
This type is used if the enctype attribute is missing from the opening <form> tag.
Follow the rules for the form field type you want to use on your site.
Setting up a Form
A single Web page may have several forms, each with a unique name
You cannot nest <form> tags within each other. Each set of <form> tags should appear independent of all other <form> tag sets.
Each form can be named by using the name attribute. This name is used by languages such as JavaScript to refer to the form and its elements.
Form Basics: Input Types
HTML forms are used to select different kinds of user input.
The most used form tag is the <input> tag. The type of input is specified with the type attribute. The most commonly used input types are explained in the next slides.
Input Types: Text Fields
Text fields are used when you want the user to type letters, numbers, etc. in a form.
Input Types: Radio Buttons
Radio Buttons are used when you want the user to select one of a limited number of choices.
Input Types: Checkboxes
Checkboxes are used when you want the user to select one or more options of a limited number of choices.
The Action Attribute and the Submit Button
When the user clicks on the "Submit" button, the content of the form is sent to another file. The form's action attribute defines the name of the file to send the content to. The file defined in the action attribute usually does something with the received input.
Drop-down Boxes
Drop-down boxes are an easy way to offer your visitors a number of choices while saving space.
A drop-down box is a selectable list.
Text-Area
This next example demonstrates how to create a text-area (a multi-line text input control).
A user can write text in the text-area. You can write an unlimited number of
characters in a text-area.
Creating a Button
You can create buttons and define your own text on the button.
Buttons can be quite useful if you want to make your page unique
Fieldset Around Data
This next example demonstrates how to draw a border with a caption around
your data.
Top Related