HTML - Text Fields

What are Text Fields

Text fields in an HTML form is a very good medium to get input from users. This is also one of the most widely used control to gather input. In situations where the data is already available in a database the input fields can be pre filled.

Attributes of Text Field:

Name: This attribute specifies the name of the object through which it can be referenced.

Value: This is used to specify the value of the text field.

Size: This attribute is used to specify the width of the textfield

Maxlength: Used to specify the maximum number of characters that can be entered.

Align: Used to specify the alignment of the field. This attribute possibly takes the following values : Top, Middle, Bottom, Right, Left.

A text field can be placed by using the following format:

simple text fields code

<form>
First name: <input name="firstname" type="text"> 
<br/>
Last name: <input name="lastname" type="text">
</form>

text fields with default value

To make it easier for users to provide input, default values can be entered in the text fields. In database web applications these values can be retrieved directly from database and populated in these fields.

<form>
<input type="text" size="15"  value="" /><br/> 
<input type="text" size="20" value="Beauty is in" /><br/>
<input type="text" size="30" value="the eye of the beholder" /><br/>
</form>

text fields with variable length

size attribute can be used to control the display length of the text field.

<form>
<input type="text" size="2"><br/>
<input type="text" size="6"><br/> 
<input type="text" size="10"><br/>
<input type="text" size="14"><br/>
<input type="text" size="18"><br/>
</form>

text fields with text align

align attribute can be used to align the text

<form>
<input type="text" align="left" value="Beauty is in"> 
<input type="text" align="right" value="the eye of"> 
<input type="text" align="middle" value="the beholder"> 
</form>