Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

เมธอด submit() ของ HTML DOM Form


เมธอด submit() ของ HTML DOM Form ใช้สำหรับส่งข้อมูลฟอร์มไปยังที่อยู่ที่ระบุโดยแอตทริบิวต์ action มันทำหน้าที่เหมือนปุ่ม submit สำหรับส่งข้อมูลฟอร์มและไม่รับพารามิเตอร์ใดๆ

ไวยากรณ์

ไวยากรณ์สำหรับเมธอด submit() ของ Form:

formObject.submit()

ตัวอย่าง

มาดูตัวอย่างสำหรับเมธอด submit() ของ Form:

<!DOCTYPE html> <html> <head> <style>    form{       border:2px solid blue;       margin:2px;       padding:4px;    } </style> <script>    function ResetForm() {       document.getElementById("FORM1").reset();       document.getElementById("Sample").innerHTML="Form has been reset";    } </script> </head> <body> <h1>Form reset() method example</h1> <form id="FORM1" method="post" action="/sample_page.php"> <label>User Name <input type="text" name="usrN"></label> <br><br> <label>Age <input type="text" name="Age"><label> <br><br> <input type="submit" value="SUBMIT"> <input type="button" onclick="ResetForm()" value="RESET"> </form> <p id="Sample"></p> </body> </html>

ผลลัพธ์

จะได้ผลลัพธ์ดังนี้:

เมธอด submit() ของ HTML DOM Form

เมื่อคลิกปุ่ม SUBMIT ฟอร์มจะถูกส่งและ “sample_page.php” จะแสดง:

เมธอด submit() ของ HTML DOM Form

ในตัวอย่างข้างต้น:

เราสร้างฟอร์มที่มี id=”FORM1” method=”post” และ action=”/sample_page.php” มีช่อง input type text สองช่องและปุ่มชื่อ SUBMIT:

<form id="FORM1" method="post" action="/sample_page.php"> <label>User Name <input type="text" name="usrN"></label> <br><br> <label>Age <input type="text" name="Age"><label> <br><br> <input type="submit" value="SUBMIT"> <input type="button" onclick="ResetForm()" value="RESET"> </form>

ปุ่ม SUBMIT เรียกใช้เมธอด SubmitForm() เมื่อผู้ใช้คลิก:

<input type="button" onclick="SubmitForm()" value="SUBMIT">

เมธอด ResetForm() ดึงองค์ประกอบ <form> โดยใช้ getElementById() ของ document และเรียกเมธอด submit() บนมัน ซึ่งส่งข้อมูลฟอร์มไปยังที่อยู่ที่ระบุโดยแอตทริบิวต์ action:

function SubmitForm() {    document.getElementById("FORM1").submit(); }