11. การสร้างแบบฟอร์ม

การสร้างแบบฟอร์ม Form

การสร้างแบบฟอร์ม สมัครสมาชิก แบบสอบถาม แบบสั่งซื้อสินค้าทางอินเตอร์เน็ตหลายๆอย่าง มีวิธีการสร้างดังนี้

ตัวอย่าง

การสร้างแบบฟอร์มจะต้องขึ้นด้วย<form>และแท็กปิดคือ</form>อยู่ภายใต้ของ<html>อีกครั้ง

ตัวอย่าง

<html>

<body>

<form>..............

..............

</form>

</body>

</html>

input หมายถึง การกลอกข้อมูลลงไปในฟอร์ม จะต้องมีทุกฟอร์ม

name="ใส่ชื่อ" คือ ชื่อแบบฟอร์มของเรา

type="ประเภท" เป็นตัวกำกับประเภทต่างๆ

size="เลข" คือ ใส่ตัวเลขเพื่อกำหนดขนาดความยาวของช่องกลอกข้อความ

maxlength="เลข" คือ ใส่ตัวเลขเพื่อกำหนดภายในช่องกลอกข้อความว่าจะให้มีอักษรกี่ตัว

value="เลข,ข้อความ" คือเลขหรือข้อความที่กำหนดค่า

type="มี 7 ชนิด" คือ

1.<type="text"> ประเภทตัวเลขหรือตัวหนังสือ ไว้กลอกข้อมูล เช่น

<form>

<input name="v" type="text">ชื่อ

</form>

ชื่อ

2.<type="password"> คือ เป็นระหัสผ่าน ตัวเลขหรือหนังสือก็ได้ เช่น

<form>

<input name="v" type="password">ระหัสผ่าน

</form>

ระหัสผ่าน

3.<type="checkbox"> คือ รูปสี่เหลี่ยมเล็กๆไว้สำหรับติกเครื่องหมายถูกลงในรูปสี่เหลี่ยมนี้ เช่น

<form>

<input name="v" type="checkbox">ไทย

<input name="v" type="checkbox">ลาว

</form>

ไทย

ลาว

4.<type="radio"> คือ วงกลมเล็กๆเมื่อคลิกแล้วจะมีจุดสีดำอยู่ข้างใน เช่น

<form>

<input name="v" type="radio">ชาย

<input name="v" type="radio">หญิง

<input name="v" type="radio">กระเทย

</form>

ชาย

หญิง

กระเทย

5.<type="reset"> คือ ปุ่มเมื่อคลิกแล้วข้อความที่กลอกไว้จะหายหมด เช่น

<form>

<input name="v" type="text">ชื่อ

</form>

ชื่อ

6.<type="submit"> คือ ปุ่มตกลง,ยอมรับหรือยืนยันนั่นเอง เช่น

<form>

</form>

7.<type="file"> เป็นการโหลดไฟล์จากเครื่องขึ้นมาไว้ตามที่กำหนด และจะต้องใช้ประโยคนี้ ENCTYPE="MULTIPART/FORM-DATA เช่น

</form>

การสร้างตัวเลือกด้วย select

<select> คือตัวให้เลือกลงมาหลายข้อ

<form>

<option value="1">ก

<option value="2">ข

<option value="1">ค

<option value="2">ง

</select>

</form>

การกำหนดขนาดช่องกลอกข้อมูลด้วย <textarea>

text คือ ข้อความ

area คือ พื้นที่ เอามารวมกัน คือ textarea แปลว่า พื้นที่ของข้อความ

rows คือ ความสูงของช่อง

cols คือ คือความยาวของช่อง

ตัวอย่าง

<form>

</textarea>

</form>

11. การสร้างแบบฟอร์ม

การสร้างแบบฟอร์ม Form

ตัวอย่าง

การสร้างตัวเลือกด้วย select

การกำหนดขนาดช่องกลอกข้อมูลด้วย <textarea>

ตัวอย่าง

นายสุทธิพงศ์ สำนักนิตย์ โรงเรียนพนาสนวิทยา จ.สุรินทร์