Để ngăn người dùng gửi biểu mẫu mà không điền vào mọi trường bắt buộc, chỉ cần thêm required
thuộc tính cho phần tử đầu vào mà họ phải điền để gửi:
Ví dụ:
<form id="form">
<input type="text" name="full-name" placeholder="Full name" required />
<input type="text" name="email" placeholder="Email" required />
<input type="text" name="phone-number" placeholder="Phone number" />
<button id="button-submit-form" type="submit">
Submit Form
</button>
</form>
Cả tên đầy đủ và email có required
trong đoạn mã trên.
Bây giờ nếu người dùng nhấp vào Gửi biểu mẫu mà không điền vào cả hai trường bắt buộc, họ sẽ nhận được cảnh báo bật lên sau: