HTML Form Input Element Text Fields
1.<input type="text" /> defines a one-line input field that a user can enter text into.
2.The input element is used to store user information.
3.An input element can be of type text field, checkbox, password, radio button, submit button, and more.
4.All input controls are represented with the <input> element.
type attribute indicates the type of control you want.
5.The <input type="text"> tag is a text box, while <input type="submit"> creates a submit button for sending web page back to the web server.
6.Used to provide input fields for text, phone numbers, dates, etc.
7.The default width of a text field is 20 characters.
Textboxes use the following attributes
size—determines the size of the textbox in characters. Default = 20 characters.
maxsize—determines the maximum number of characters that the field will accept.
name—the name of the variable to be sent to the CGI application.
value—will display its contents as the default value.
submit—A submit button is used to send form data to a server.
Example: 1
<html>
<body>
<form>
Name: <input type ="text" name="name"/>
<input type="submit"/>
</form>
</body>
</html>
<body>
<form>
Name: <input type ="text" name="name"/>
<input type="submit"/>
</form>
</body>
</html>
Output
To change the size of text input box, add another attribute called size.
Example: 2
<html>
<body>
<form>
Name: <input type ="text" name="name " size="10"/>
<input type="submit"/>
</form>
</body>
</html>
<body>
<form>
Name: <input type ="text" name="name " size="10"/>
<input type="submit"/>
</form>
</body>
</html>
If you want to limit the amount of characters put in the text box, need another attribute called maxlength.
Example: 3
<html>
<body>
<form>
Name: <input type ="text" name="name " size="10" maxlength="5"/>
<input type="submit"/>
</form>
</body>
</html>
<body>
<form>
Name: <input type ="text" name="name " size="10" maxlength="5"/>
<input type="submit"/>
</form>
</body>
</html>
Output
The user can only enter 5 characters.If you want to populate the box with some text, you need value attribute.
Example: 4
<html>
<body>
<form>
Name: <input type ="text" name="name " size="10" maxlength="5" value="Enter Name Here"/>
<input type="submit"/>
</form>
</body>
</html>
<body>
<form>
Name: <input type ="text" name="name " size="10" maxlength="5" value="Enter Name Here"/>
<input type="submit"/>
</form>
</body>
</html>
Output
No comments:
Post a Comment