คุณสมบัติที่จำเป็นสำหรับข้อความอินพุต HTML DOM เชื่อมโยงกับแอตทริบิวต์ที่จำเป็นขององค์ประกอบ คุณสมบัติที่จำเป็นใช้สำหรับการตั้งค่าและส่งคืนหากจำเป็นต้องกรอกฟิลด์ข้อความหรือไม่ก่อนที่จะส่งแบบฟอร์มไปยังเซิร์ฟเวอร์ ซึ่งจะทำให้ไม่สามารถส่งแบบฟอร์มได้หากช่องข้อความที่มีแอตทริบิวต์ที่จำเป็นว่างเปล่าโดยผู้ใช้
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์สำหรับ −
การตั้งค่าคุณสมบัติที่ต้องการ -
textObject.required = true|false
ในที่นี้ true หมายถึงช่องข้อความที่ต้องกรอก ในขณะที่ false หมายถึงตัวเลือกในการกรอกข้อมูลในช่องก่อนที่จะส่งแบบฟอร์ม
ตัวอย่าง
ให้เราดูตัวอย่างสำหรับคุณสมบัติที่จำเป็นในการป้อนข้อความ -
<!DOCTYPE html>
<html>
<body>
<h1>Input Text required property</h1>
<form action="/Sample_page.php">
USERNAME: <input type="text" id="USR" name=”user_name” required>
<input type="submit">
</form>
<p>Check if the above field is mandatory to be filled or not by clicking the below button</p>
<button onclick="checkReq()">CHECK</button>
<p id="Sample"></p>
<script>
function checkReq() {
var Req=document.getElementById("USR").required;
if(Req==true)
document.getElementById("Sample").innerHTML="The text field must be filled before submitting";
else
document.getElementById("Sample").innerHTML="The text field is optional and can be left blank by the user";
}
</script>
</body>
</html> ผลลัพธ์
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
เมื่อคลิกปุ่มตรวจสอบ -
หากคุณจะคลิก "ส่ง" ตอนนี้โดยไม่ป้อนชื่อผู้ใช้ คำเตือนจะปรากฏขึ้นและไม่อนุญาตให้คุณส่งแบบฟอร์ม -
