Upload
-
View
141
Download
1
Embed Size (px)
Citation preview
การสร้างแบบฟอร์ม
การ
ส่ง
ค่า
ตัว
แปร
การสร้างแบบฟอร์ม
การสร้างแบบฟอร์ม
รูปแบบพืน้ฐานการสร้าง Tag
ชื่อ Tag <form> ... </form>
ค าอธิบาย ใช้สร้างแบบฟอร์ม
ตัวอย่าง <form>
<input type="text" name=“panda" />
<input type="submit" name="submit" />
</form>
การสร้างแบบฟอร์ม
ชื่อ Tag <input type="value" />
ค่าvalue text, password, reset, button, file,
checkbox, radio
ค าอธิบาย ใช้ในการก าหนด ช่องรับข้อมูลประเภทต่างๆ
ตัวอย่าง <input type="text" name="panda" /> <input
type="submit" name="submit" />
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <label> ... </label>
ค่าvalue ใช้ก าหนด ป้ายชื่อ ให้กับ ช่องรับข้อมูล
ค าอธิบาย ใช้ก าหนด ป้ายชื่อ ให้กับ ช่องรับข้อมูล
ตัวอย่าง <label> ชื่อ : <input type="text" /> </label>
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <input name="value" />
ค่าvalue ข้อความ
ค าอธิบาย ใช้ก าหนดชื่อให้กับ ช่องรบัข้อมูล
ตัวอย่าง <input type="text" name="sex" /> <input
type="text" name="name" />
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <input id="value" />
ค่าvalue ข้อความ
ค าอธิบาย ใช้ก าหนด id ให้กับ ช่องรบัข้อมูล
ตัวอย่าง <input type="text" name="sex" /> <input
type="text" name="name" />
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <input value="value" />
ค่าvalue ข้อความ
ค าอธิบาย ใช้ก าหนดค่าข้อมูล ให้กับช่องรับข้อมูล
ตัวอย่าง <input type="text" name="sex" value="man"
/> <input type="text" name="name"
value=“JSP" />
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <input maxlength="value" />
ค่าvalue ตัวเลข
ค าอธิบาย ใช้ก าหนดจ านวนสูงสุด ที่สามารถพิมพ์ลงไปได ้
ตัวอย่าง <input type="text" name="sex"
maxlength="5" /> <input type="text"
name="name" maxlength="25" />
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <input size="value" />
ค่าvalue ตัวเลข
ค าอธิบาย ใช้ก าหนด ขนาด ของช่องรับข้อมูล
ตัวอย่าง <input type="text" name="sex" size="8" />
<input type="text" name="name" size="12"
/>
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <input src="value" />
ค่าvalue ชื่อไฟล์ภาพ
ค าอธิบาย ใช้ก าหนดรูปภาพ
ตัวอย่าง <input type="image" src="panda.gif" />
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <input checked="value" />
ค่าvalue checked
ค าอธิบาย ใช้ก าหนดว่าให้ checkbox หรือ radio นั้น ถูกเลือก
อยู่
ตัวอย่าง <input type="checkbox"
checked="checked" /> <input type="radio"
checked="checked" />
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <textarea> ... </textarea>
ค าอธิบาย ใช้ในการก าหนด อุปกรณ์การรับข้อมูล แบบรับ
ข้อความได้หลายบรรทัด
ตัวอย่าง <textarea cols="30" rows="5"> ข้อความ
</textarea>
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <select> ... </select>
ค าอธิบาย ใช้สร้างช่องรับข้อมูลแบบ dropdown
ตัวอย่าง <select name="country"> <option
value="1"> Thailand </option> <option
value="2"> England </option> </select>
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <select name="value"> ... </select>
ค่าvalue ข้อความ
ค าอธิบาย ใช้ก าหนดชื่อช่องรับข้อมูล
ตัวอย่าง <select name="country"> ... </select>
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <select size="value"> ... </select>
ค่าvalue ตัวเลข
ค าอธิบาย ใช้ก าหนดขนาดของ list ซึ่งเมื่อก าหนดมากกว่า 1 จะ
ท าให้ list นี้ กลายเป้น list box ( ปกติเป็นแบบ
dropdown list )
ตัวอย่าง <select size="5"> ... </select>
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <option value="value"> ... </value>
ค่าvalue ข้อความ
ค าอธิบาย ใช้ก าหนด ค่าข้อมูล ของรายการ โดยค่าข้อมูลนี้จะ
ถูกส่งไป เมื่อมีการ submit form
ตัวอย่าง <option value="1"> Thailand </option>
<option value="2"> England </option>
รูปแบบพืน้ฐานการสร้าง Tag
การสร้างแบบฟอร์ม
ชื่อ Tag <option selected="value"> ... </option>
ค่าvalue selected
ค าอธิบาย ใช้ก าหนดว่า รายการนั้น ถูกเลือกอยู่
ตัวอย่าง <option> Thailand </option> <option
selected="selected"> England </option>
<option> Australia </option>
รูปแบบพืน้ฐานการสร้าง Tag
ตัวอย่างแบบฟอร์ม
ตัวอย่างการออกแบบ Web site
การส่งค่าตัวแปร
การส่งค่า Servlet
การส่งค่าตัวแปร
การรบัคา่มาแสดง
ตัวอย่างการส่งค่าตัวแปร
การรบัคา่มาแสดง
1. นายภาสกร อินทสิทธิ์ รหัส 5304101373
2. นางสาวกนกนวล อินขาน รหัส 5404101301
3. นายจักรกฤษณ์ โพธิ์แปลง รหัส 5404101313
4. นายประดิษฐิ ์ นิลรัตน์ รหัส 5404101348
5. นายอนุสรณ์ สุนันตะ รหัส 5404101409
สาขาวิทยาการคอมพวิเตอร ์ กลุ่มเรียนที่ 1
สมาชิกกลุ่ม