SlideShare a Scribd company logo
Basic PHP Programming


HTML Form และ การรับข้อมูลจากผู้ใช้

                          โดย
                  อ.เรวดี พิพฒน์สูงเนิน
                             ั
    สาขาวิชาวิทยาการคอมพิวเตอร์และเทคโนโลยีสารสนเทศ
       คณะวิทยาศาสตร์ มหาวิทยาลัยราชภัฏอุดรธานี
ฟอร์ม (Form)
• แท็ก <form> เป็นแท็กที่บรรจุแท็กอื่น ๆ ที่ใช้ในการรับข้อมูล
  จากผู้ใช้เพื่อส่งค่าไปยังเซิร์ฟเวอร์
• แอตทริบิวต์พื้นฐานที่จาเป็นในแท็ก <form>
   – action : กาหนดเพจปลายทางในเว็บเซิรฟเวอร์ที่จะส่งข้อมูล
                                           ์
   – method : กาหนดวิธีการส่งข้อมูล มี 2วิธี ได้แก่ GET , POST
• รูปแบบ
     <form method = “POST” action = “register.php”>
       …
     </form>
ช่องรับข้อความ (TextBox)
• รูปแบบ
<input type=“text” name=“ชื่อ” value=“ค่าเริ่มต้น”
        size= “ความกว้าง” maxlength = “จานวนตัวอักษร”>
• เช่น
<input type=“text” name=“firstname” size= “20”>

 ผลลัพธ์
ช่องรับรหัสผ่าน (PasswordBox)
• รูปแบบ
<input type=“password” name=“ชื่อ” value=“ค่าเริ่มต้น”
        size= “ความกว้าง” maxlength = “จานวนตัวอักษร”>
• เช่น
<input type=“password” name=“pwd” size= “20”>

 ผลลัพธ์
ช่องรับข้อมูลหลายบรรทัด (TextArea)
• รูปแบบ
<textarea name =“ชื่อ” cols=“ความกว้าง” rows=“จานวนแถว”>
</textarea>
• เช่น
<textarea name =“address” cols=“50” rows=“4”>
</textarea>
 ผลลัพธ์
เช็คบ๊อกซ์(CheckBox)
• รูปแบบ

<input type=“checkbox” name=“ชื่อ” value=“ค่า”>

• เช่น



 ผลลัพธ์
ปุ่มเรดิโอ(Radio Button)
• รูปแบบ

<input type=“radio” name=“ชื่อ” value=“ค่า”>

• เช่น


 ผลลัพธ์
ลิสต์บ๊อกซ์(ListBox)
• รูปแบบ
<select name=“ชื่อ” size=“ความสูง” multiple>
<option value=“ค่า” selected>ข้อความ</option>
</select>

• เช่น
ลิสต์บ๊อกซ์(ListBox)
ลิสต์บ๊อกซ์(ListBox)
Hidden field
• จะไม่แสดงข้อมูลบนหน้าเว็บ แต่สามารถกาหนดค่าและส่งค่า
  ไปยังเพจอื่นได้
• รูปแบบ
<input type=“hidden” name=“ชื่อ” value=“ค่า”>
ช่องรับชือไฟล์
                              ่
• รูปแบบ
 <input type=“file” name=“ชื่อ” size=“ความกว้าง”
         maxlength=“จานวนตัวอักษร”>

• เช่น
ปุ่มคาสั่ง
• ปุ่มส่งข้อมูล (Submit Button) ใช้ส่งข้อมูลจากฟอร์มไปยัง
  เซิร์ฟเวอร์
• รูปแบบ
<input type=“submit” name=“ชื่อ” value=“ค่า>
• เช่น
ปุ่มคาสั่ง
• ปุ่มล้างข้อมูล(Reset Button) ใช้ล้างข้อมูลจากฟิลด์ต่าง ๆ
  ภายในฟอร์ม
• รูปแบบ
<input type=“reset” name=“ชื่อ” value=“ค่า>
• เช่น
ปุ่มคาสั่ง
• ปุ่มธรรมดา(Button) นิยมใช้เพื่อเขียนสคริปต์ที่ทางานฝั่ง
   ไคลเอนต์ เช่น JavaScript โดยเขียนคาสั่งไว้ที่ event
   “OnClick” เพื่อให้เกิดการทางานบางอย่าง
•<input type=“button” name=“ชื่อ” value=“ค่า>
   รูปแบบ

• เช่น
WorkShop
• ให้สร้างฟอร์มสมัครสมาชิก
เปรียบเทียบการส่งข้อมูลแบบ GET และ POST
• การส่งข้อมูลด้วยวิธี GET
• เว็บบราวเซอร์จะนาข้อมูลจากฟอร์มมาจัดรูปแบบเป็น Query
  String และระบุต่อท้าย URL ของเพจปลายทาง
                                          Query String
เปรียบเทียบการส่งข้อมูลแบบ GET และ POST
• การส่งข้อมูลด้วยวิธี POST
• ข้อมูลที่ส่งผ่านฟอร์มจะถูกเข้ารหัส(URL Encoding) ทาให้
  มองไม่เห็นข้อมูลที่ส่งไป
                                             Query String
การรับข้อมูลด้วยคาสั่ง $_GET
• การรับข้อมูลด้วยคาสั่ง $_GET ใช้กับการส่งข้อมูลมายังเพจ
  แบบ Query String คือส่งจากฟอร์มด้วย method = “get”
  หรือการส่งค่าแนบต่อท้าย URL
• รูปแบบ

                 $_GET[ตัวแปรที่ส่งค่ามา]
Ex. การรับ-ส่งข้อมูลด้วยวิธี GET จากฟอร์ม
                                                   ไฟล์
                                               form1.html




ค่า URL บน Address bar




                                                    ไฟล์
                                                welcome.php
Ex. การรับ-ส่งข้อมูลด้วยวิธี GET จากลิงก์
ใช้แท็กลิงก์ และแนบข้อมูลต่อท้าย URL




ค่า URL บน Address bar




                                                          ไฟล์
                                                      welcome.php
การรับข้อมูลด้วยคาสั่ง $_POST
• การรับข้อมูลด้วยคาสั่ง $_POST ใช้กับการส่งข้อมูลมายังเพจ
  จากการส่งจากฟอร์มด้วย method = “post”
• รูปแบบ

                 $_POST[ตัวแปรที่ส่งค่ามา]
Ex. การรับ-ส่งข้อมูลด้วยวิธี POST จากฟอร์ม
                                                   ไฟล์
                                               form2.html




ค่า URL บน Address bar




                                                    ไฟล์
                                                welcome.php
การรับข้อมูลด้วยคาสั่ง $_REQUEST
• การรับข้อมูลด้วยคาสั่ง $_REQUEST ใช้กับการส่งข้อมูลมายัง
  เพจจากการส่งจากฟอร์มด้วย method = “post” และ
  method =“get”
• รูปแบบ
               $_REQUEST[ตัวแปรที่ส่งค่ามา]

More Related Content

PDF
การสร างแบบฟอร ม
PDF
lesson1 JSP
PDF
Html
PPTX
PDF
บทที่ 2 พื้นฐานภาษาจาวา
PDF
Introduction to XML.
PDF
(Php basic 1 [โหมดความเข้ากันได้])
PDF
01 intro php
การสร างแบบฟอร ม
lesson1 JSP
Html
บทที่ 2 พื้นฐานภาษาจาวา
Introduction to XML.
(Php basic 1 [โหมดความเข้ากันได้])
01 intro php

Viewers also liked (14)

PDF
02 controlflow php
PDF
Php training
PDF
Php nuke
PDF
Phptraining
PPT
PDF
ความรู้พื้นฐานเกี่ยวกับภาษา PHP
PDF
การเขียนโปรแกรมบนเว็บ
PDF
ความรู้เบื้องต้นเกี่ยวกับภาษาPhp
PPTX
PHP programmimg
PDF
หลักการแก้ปัญหา
PDF
HTML PHP MySQL สำหรับเว็บโปรแกรมเมอร์มือใหม่
PPTX
PHP Powerpoint -- Teach PHP with this
PPT
Php Presentation
02 controlflow php
Php training
Php nuke
Phptraining
ความรู้พื้นฐานเกี่ยวกับภาษา PHP
การเขียนโปรแกรมบนเว็บ
ความรู้เบื้องต้นเกี่ยวกับภาษาPhp
PHP programmimg
หลักการแก้ปัญหา
HTML PHP MySQL สำหรับเว็บโปรแกรมเมอร์มือใหม่
PHP Powerpoint -- Teach PHP with this
Php Presentation
Ad

Similar to 06 form input_php (20)

PDF
lesson1 JSP
PDF
Dw ch06 form_and_php
PDF
การเขียนเว็บไซต์ด้วยภาษาPhp
PDF
Book sru
PPT
PHP Tutorial (introduction)
PPT
การพัฒนาเอกสารออนไลน์ขั้นสูง Lect 05
PDF
PPT
เริ่มต้นกับ PHP
PPTX
หน่วยที่ 10
PDF
Dw ch05 basic_php
PPT
Php beginner
PPTX
Presentation1
DOCX
คู่มือJavascript and Python
PDF
Course Syllabus การเขียนโปรแกรมบนเว็บ
DOCX
Lesson 6
DOC
งานครูปลาม์
lesson1 JSP
Dw ch06 form_and_php
การเขียนเว็บไซต์ด้วยภาษาPhp
Book sru
PHP Tutorial (introduction)
การพัฒนาเอกสารออนไลน์ขั้นสูง Lect 05
เริ่มต้นกับ PHP
หน่วยที่ 10
Dw ch05 basic_php
Php beginner
Presentation1
คู่มือJavascript and Python
Course Syllabus การเขียนโปรแกรมบนเว็บ
Lesson 6
งานครูปลาม์
Ad

06 form input_php