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

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

  • Upload
    -

  • View
    141

  • Download
    1

Embed Size (px)

Citation preview

Page 1: การสร างแบบฟอร ม

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

การ

ส่ง

ค่า

ตัว

แปร

Page 2: การสร างแบบฟอร ม

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

Page 3: การสร างแบบฟอร ม

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

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

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

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

ตัวอย่าง <form>

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

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

</form>

Page 4: การสร างแบบฟอร ม

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

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

ค่าvalue text, password, reset, button, file,

checkbox, radio

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

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

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

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

Page 5: การสร างแบบฟอร ม

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

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

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

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

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

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

Page 6: การสร างแบบฟอร ม

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

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

ค่าvalue ข้อความ

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

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

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

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

Page 7: การสร างแบบฟอร ม

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

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

ค่าvalue ข้อความ

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

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

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

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

Page 8: การสร างแบบฟอร ม

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

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

ค่าvalue ข้อความ

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

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

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

value=“JSP" />

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

Page 9: การสร างแบบฟอร ม

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

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

ค่าvalue ตัวเลข

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

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

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

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

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

Page 10: การสร างแบบฟอร ม

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

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

ค่าvalue ตัวเลข

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

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

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

/>

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

Page 11: การสร างแบบฟอร ม

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

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

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

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

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

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

Page 12: การสร างแบบฟอร ม

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

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

ค่าvalue checked

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

อยู่

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

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

checked="checked" />

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

Page 13: การสร างแบบฟอร ม

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

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

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

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

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

</textarea>

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

Page 14: การสร างแบบฟอร ม

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

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

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

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

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

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

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

Page 15: การสร างแบบฟอร ม

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

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

ค่าvalue ข้อความ

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

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

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

Page 16: การสร างแบบฟอร ม

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

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

ค่าvalue ตัวเลข

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

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

dropdown list )

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

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

Page 17: การสร างแบบฟอร ม

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

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

ค่าvalue ข้อความ

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

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

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

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

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

Page 18: การสร างแบบฟอร ม

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

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

ค่าvalue selected

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

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

selected="selected"> England </option>

<option> Australia </option>

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

Page 19: การสร างแบบฟอร ม

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

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

Page 20: การสร างแบบฟอร ม

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

การส่งค่า Servlet

Page 21: การสร างแบบฟอร ม

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

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

Page 22: การสร างแบบฟอร ม

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

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

Page 23: การสร างแบบฟอร ม

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

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

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

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

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

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

สมาชิกกลุ่ม