The HTML <input type="text"> element is used to create a single-line text input field in a form. It allows users to enter plain text data such as names, usernames, or search queries.
- Used to accept single-line text input from users.
- Created using <input type="text"> and commonly used in forms.
- Supports attributes like placeholder, required, maxlength, and value.
Syntax:
<input type="text">Attributes
- name: Specifies the name of the input element used to identify form data after submission.
- value: Specifies the default value of the input field.
- placeholder: placeholder provides a hint about the expected input value.
- maxlength: maxlength defines the maximum number of characters allowed in the input field.
- required: required indicates that the input field must be filled before form submission.
- readonly: readonly makes the input field read-only and prevents value modification.
- disabled: disabled disables the input field and excludes it from form submission.
Example 1: We are using the <input type="text"> element to create text input fields for collecting the first and last names in a form.
<!--Driver Code Starts-->
<!DOCTYPE html>
<html>
<body>
<h2>HTML <input type="text"></h2>
<!--Driver Code Ends-->
<form action="#">
<label for="fname">First Name</label>
<input type="text" id="fname">
<br><br>
<label for="lname">Last Name</label>
<input type="text" id="lname">
</form>
<!--Driver Code Starts-->
</body>
</html>
<!--Driver Code Ends-->
Example 2: Text Input with Validation
<!--Driver Code Starts-->
<!DOCTYPE html>
<html>
<body>
<!--Driver Code Ends-->
<form>
<label for="email">Email:</label>
<input type="text" id="email"
name="email"
placeholder="Enter your email" required>
<br><br>
<label for="name">Name:</label>
<input type="text" id="name"
name="name" required>
<br><br>
<input type="submit" value="Submit">
</form>
<!--Driver Code Starts-->
</body>
</html>
<!--Driver Code Ends-->