PUBLISHED ON: JULY 29, 2021
How to create input field of type text using HTML form?
Answer: Using input
tag with type
attribute having value text
.
The forms are widely used on the webpage to take input from users. The forms can be used to log in, register, surveys, etc., or for any other purpose.
Almost every form contains several input fields. An input field is used to take the input from the users. The input can be some text, emails, or any phone number, etc. It is to be validated that the users input the data as per the requirement. Here, we will learn to create an input field that takes only text.
The type
attribute
The type
attribute in <input>
tag describes the type of input that can be entered in the input field. For textual input field use type="text". It is used for single-line input text.
Here is the syntax for it,
<input type="text" ... />
Example: Creating a textual input field
Here in the example, we will create a form with only textual input fields.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<h2>Textual input field</h2>
<form>
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br>
<input type="submit">
</form>
</body>
</html>
Output:
Here is the output of the above program.
Example: Max and min length of text in the input field
We can also limit the length of text in the input field. Use the minlength
attribute to add the minimum length for the input text and the maxlength
attribute to add the maximum length limit for the input text in the input field.
Here is an example to illustrate this.
Conclusion
We can use the input field type of text in HTML. The type="text" attribute is used to set the input field of the type text. Also, the text max and min length can be defined using its attributes.