logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
European Travel
Action Movies
Bible Basics
Houseplants
Romance Movies
Creativity
Family Travel


dailyclick
All times in EST

Clairvoyance: 08:00 PM

Full Schedule
g
g HTML Site

BellaOnline's HTML Editor

g

Text Input Options for HTML Forms

Guest Author - Elizabeth Connick

In the article "Parts of a Website Form" we briefly discussed the input options that are available for form designers. Now it's time to take a closer look at some of those options. Specifically, here are three fields that allow you to capture and store text information entered by your visitors.

Text Field
The text field is one of the most frequently used form fields. It's used to capture short text answers such as the visitor's name. You can use "size=" to change the size of the text field; "maxlength=" to limit the number of characters the visitor can enter, such as with a phone number or zip code field; and you can also set an initial value with "value=".

A text field that's coded like this:

<input type="text" size="20" maxlength="15" value="Text Here!">

... would look like this on your site:



Text Area
Text areas are used less frequently than text fields; they are used to capture larger blocks of input, so you might add one to your form as a Comments field, for example. As with the text field, you can specify the field's size; "rows=" sets the text area's width, while "cols=" sets its height. Text areas also have a word wrap option. If you set it to "wrap=off" then entered text is treated as one long line; "wrap=virtual" means that the text appears to wrap within the form but the data itself is sent to the server without linebreaks, while "wrap=physical" causes the form to add actual linebreaks to the field and send it to the server with the breaks included.

A text area coded like this:

<textarea rows="20" cols="8" wrap="virtual">You can experiment by entering some text into this box.</textarea>

... would look like this:

-TEXTAREA- rows="6" cols="40" wrap="virtual">You can experiment by entering some text into this box.-TEXTAREA->

Password Field

The password field is similar to the text field, but anything the visitor enters into the field is obscured all your visitor sees is a string of dots. This can be extremely reassuring to a visitor, since anyone who happens to walk behind them as they enter their information will not be able to pick up the user's password at a glance. Do keep in mind that data entered into a password field is not actually encrypted if you want to add security to your user's information you'll have to do some other way, usually by setting up a secure site.

The password field's attributes are identical to a text field's.

A password field coded like this:

<input type="password" size="20" maxlength="15">

... would look like this:

This site needs an editor - click to learn more!

Add Text+Input+Options+for+HTML+Forms to Twitter Add Text+Input+Options+for+HTML+Forms to Facebook Add Text+Input+Options+for+HTML+Forms to MySpace Add Text+Input+Options+for+HTML+Forms to Del.icio.us Digg Text+Input+Options+for+HTML+Forms Add Text+Input+Options+for+HTML+Forms to Yahoo My Web Add Text+Input+Options+for+HTML+Forms to Google Bookmarks Add Text+Input+Options+for+HTML+Forms to Stumbleupon Add Text+Input+Options+for+HTML+Forms to Reddit




Parts of a Website Form
RSS
Related Articles
Editor's Picks Articles
Top Ten Articles
Previous Features
Site Map


For FREE email updates, subscribe to the HTML Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2014 by Elizabeth Connick. All rights reserved.
This content was written by Elizabeth Connick. If you wish to use this content in any manner, you need written permission. Contact BellaOnline Administration for details.

g


g features
What's Coming in HTML 5

What is FTP?

HTML Fundamentals - Tables

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2014 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor