Top Banner
การสร้างแบบฟอร์ม การ ส่ง ค่า ตัว แปร
25

lesson1 JSP

Dec 18, 2014

Download

Documents

Kukik Kanoknuan

 
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: lesson1 JSP

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

การ

ส่ง

ค่า

ตัว

แปร

Page 2: lesson1 JSP

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

Page 3: lesson1 JSP

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

รูปแบบพืน้ฐานการสร้าง Tag

ชื่อ Tag <form> ... </form>

ค าอธิบาย ใช้สร้างแบบฟอร์ม

ตัวอย่าง <form method="post" action="update.php">

<input type="text" name="panda" /> <input

type="submit" name="submit" /> </form>

Page 4: lesson1 JSP

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

ชื่อ Tag <form method="value"> ... </form>

ค่าvalue get, post

ค าอธิบาย ใช้ก าหนดวิธีการส่งข้อมูล

ตัวอย่าง <form method="post"> ... </form>

รูปแบบพืน้ฐานการสร้าง Tag

Page 5: lesson1 JSP

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

ชื่อ Tag <form action="value"> ... </form>

ค่าvalue ชื่อไฟล์ ( ประเภท CGI )

ค าอธิบาย ใช้ก าหนดไฟล์ที่จะรับข้อมูลไปประมวลผล

ตัวอย่าง <form action=“welcome.jsp"> ... </form>

รูปแบบพืน้ฐานการสร้าง Tag

Page 6: lesson1 JSP

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

ชื่อ Tag <input type="value" />

ค่าvalue text, password, hidden, submit, image,

reset, button, file, checkbox, radio

ค าอธิบาย ใช้ในการก าหนด ช่องรับข้อมูลประเภทต่างๆ

ตัวอย่าง <input type="text" name="panda" /> <input

type="submit" name="submit" />

รูปแบบพืน้ฐานการสร้าง Tag

Page 7: lesson1 JSP

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

ชื่อ Tag <input name="value" />

ค่าvalue ข้อความ

ค าอธิบาย ใช้ก าหนดชื่อให้กับ ช่องรับข้อมูล

ตัวอย่าง <input type="text" name="sex" /> <input

type="text" name="name" />

รูปแบบพืน้ฐานการสร้าง Tag

Page 8: lesson1 JSP

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

ชื่อ Tag <input id="value" />

ค่าvalue ข้อความ

ค าอธิบาย ใช้ก าหนด id ให้กับ ช่องรับข้อมูล

ตัวอย่าง <input type="text" name="sex" /> <input

type="text" name="name" />

รูปแบบพืน้ฐานการสร้าง Tag

Page 9: lesson1 JSP

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

ชื่อ Tag <input value="value" />

ค่าvalue ข้อความ

ค าอธิบาย ใช้ก าหนดค่าข้อมูล ให้กับช่องรับข้อมูล

ตัวอย่าง <input type="text" name="sex" value="man"

/> <input type="text" name="name"

value=“JSP" />

รูปแบบพืน้ฐานการสร้าง Tag

Page 10: lesson1 JSP

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

ชื่อ Tag <input maxlength="value" />

ค่าvalue ตัวเลข

ค าอธิบาย ใช้ก าหนดจ านวนสูงสุด ที่สามารถพิมพ์ลงไปได้

ตัวอย่าง <input type="text" name="sex"

maxlength="5" /> <input type="text"

name="name" maxlength="25" />

รูปแบบพืน้ฐานการสร้าง Tag

Page 11: lesson1 JSP

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

ชื่อ Tag <input size="value" />

ค่าvalue ตัวเลข

ค าอธิบาย ใช้ก าหนด ขนาด ของช่องรับข้อมูล

ตัวอย่าง <input type="text" name="sex" size="8" />

<input type="text" name="name" size="12"

/>

รูปแบบพืน้ฐานการสร้าง Tag

Page 12: lesson1 JSP

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

ชื่อ Tag <input src="value" />

ค่าvalue ชื่อไฟล์ภาพ

ค าอธิบาย ใช้ก าหนดรูปภาพ

ตัวอย่าง <input type="image" src="panda.gif" />

รูปแบบพืน้ฐานการสร้าง Tag

Page 13: lesson1 JSP

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

ชื่อ Tag <input checked="value" />

ค่าvalue checked

ค าอธิบาย ใช้ก าหนดว่าให้ checkbox หรือ radio นั้น ถูกเลือก

อยู ่

ตัวอย่าง <input type="checkbox"

checked="checked" /> <input type="radio"

checked="checked" />

รูปแบบพืน้ฐานการสร้าง Tag

Page 14: lesson1 JSP

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

ชื่อ Tag <textarea> ... </textarea>

ค าอธิบาย ใช้ในการก าหนด อุปกรณ์การรับข้อมูล แบบรับ

ข้อความได้หลายบรรทัด

ตัวอย่าง <textarea cols="30" rows="5"> ข้อความ

</textarea>

รูปแบบพืน้ฐานการสร้าง Tag

Page 15: lesson1 JSP

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

ชื่อ Tag <select> ... </select>

ค าอธิบาย ใช้สร้างช่องรับข้อมูลแบบ dropdown

ตัวอย่าง <select name="country"> <option

value="1"> Thailand </option> <option

value="2"> England </option> </select>

รูปแบบพืน้ฐานการสร้าง Tag

Page 16: lesson1 JSP

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

ชื่อ Tag <select name="value"> ... </select>

ค่าvalue ข้อความ

ค าอธิบาย ใช้ก าหนดชื่อช่องรับข้อมูล

ตัวอย่าง <select name="country"> ... </select>

รูปแบบพืน้ฐานการสร้าง Tag

Page 17: lesson1 JSP

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

ชื่อ Tag <select size="value"> ... </select>

ค่าvalue ตัวเลข

ค าอธิบาย ใช้ก าหนดขนาดของ list ซึ่งเมื่อก าหนดมากกว่า 1 จะ

ท าให้ list นี้ กลายเป้น list box ( ปกติเป็นแบบ

dropdown list )

ตัวอย่าง <select size="5"> ... </select>

รูปแบบพืน้ฐานการสร้าง Tag

Page 18: lesson1 JSP

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

ชื่อ Tag <option value="value"> ... </value>

ค่าvalue ข้อความ

ค าอธิบาย ใช้ก าหนด ค่าข้อมูล ของรายการ โดยค่าข้อมูลนี้จะ

ถูกส่งไป เมื่อมีการ submit form

ตัวอย่าง <option value="1"> Thailand </option>

<option value="2"> England </option>

รูปแบบพืน้ฐานการสร้าง Tag

Page 19: lesson1 JSP

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

ชื่อ Tag <option selected="value"> ... </option>

ค่าvalue selected

ค าอธิบาย ใช้ก าหนดว่า รายการนั้น ถูกเลือกอยู่

ตัวอย่าง <option> Thailand </option> <option

selected="selected"> England </option>

<option> Australia </option>

รูปแบบพืน้ฐานการสร้าง Tag

Page 20: lesson1 JSP

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

ชื่อ Tag <label> ... </label>

ค่าvalue ใช้ก าหนด ป้ายชื่อ ให้กับ ช่องรับข้อมูล

ค าอธิบาย ใช้ก าหนด ป้ายชื่อ ให้กับ ช่องรับข้อมูล

ตัวอย่าง <label> ชื่อ : <input type="text" /> </label>

รูปแบบพืน้ฐานการสร้าง Tag

Page 21: lesson1 JSP

ตัวอย่างแบบฟอร์ม

ตัวอย่างการออกแบบ Web site

Page 22: lesson1 JSP

การส่งค่าตัวแปร

การส่งค่า Servlet

Page 23: lesson1 JSP

การส่งค่าตัวแปร

การรบัค่ามาแสดง

Page 24: lesson1 JSP

ตัวอย่างการส่งค่าตัวแปร

การรบัค่ามาแสดง

Page 25: lesson1 JSP

1. นายภาสกร อินทสิทธิ์ รหัส 5304101373

2. นางสาวกนกนวล อินขาน รหัส 5404101301

3. นายจักรกฤษณ์ โพธิ์แปลง รหัส 5404101313

4. นายประดิษฐิ์ นิลรัตน์ รหัส 5404101348

5. นายอนุสรณ์ สุนันตะ รหัส 5404101409

สาขาวิทยาการคอมพิวเตอร์ กลุ่มเรียนที่ 1

สมาชิกกลุ่ม