แอตทริบิวท์ form ของ <button> ใน HTML

แอตทริบิวท์ form ของ <button> ใน HTML

แอตทริบิวท์ form ขององค์ประกอบ <button> ใช้สำหรับระบุฟอร์มที่ปุ่มนั้นสังกัด

รูปแบบการใช้งานมีดังนี้:

<button form="id">

id ข้างต้นคือ ID ของฟอร์มที่ปุ่มสังกัด

ตัวอย่าง

<!DOCTYPE html>
<html>
<body>
  <h2>คะแนน</h2>
  <form action="" method="get" id="form1">
    ผู้เล่น: <input type="text"><br>
    อันดับ: <input type="number"><br>
    คะแนน: <input type="number"><br>
  </form>
  <button type="submit" form="form1" value="Submit">คลิกเพื่อส่ง</button>
</body>
</html>

ผลลัพธ์จะเป็นดังนี้ ปุ่มเป็นส่วนหนึ่งของฟอร์ม:

ในตัวอย่างข้างต้น เราได้ตั้งค่าฟอร์มและเพิ่มองค์ประกอบฟอร์ม:

<form action="" method="get" id="form1"> ผู้เล่น: <input type="text"><br> อันดับ: <input type="number"><br> คะแนน: <input type="number"><br> </form>

พร้อมกับนั้น เราได้ตั้งค่าปุ่มนอกฟอร์ม:

<button type="submit" form="form1" value="Submit">คลิกเพื่อส่ง</button>

เนื่องจากเราตั้งค่า form id ในปุ่ม ดังนั้นมันยังคงเป็นส่วนของฟอร์มเดียวกัน สิ่งนี้เป็นไปได้โดยใช้แอตทริบิวท์ <button> form