HTML Input Object สร้างฟอร์ม เพื่อส่งค่าให้ PHP Input object แต่ละประเภท

ตอบกระทู้

รูปแสดงอารมณ์
:icon_plusone: :like: :plusone: :gfb: :-D :) :( :-o 8O :? 8) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: :angry: :baa: :biggrin:
รูปแสดงอารมณ์อื่นๆ
BBCode เปิด
[img] เปิด
[url] เปิด
[Smile icon] เปิด
กระทู้แนะนำ
   

มุมมองที่ขยายได้ กระทู้แนะนำ: HTML Input Object สร้างฟอร์ม เพื่อส่งค่าให้ PHP Input object แต่ละประเภท

Re: HTML Input Object สร้างฟอร์ม เพื่อส่งค่าให้ PHP Input object แต่ละประเภท

โดย tongclub48 » 06/05/2015 3:25 pm

รูปแบบการสร้าง input แบบ password นั้นเป็น ดังต่อไปนี้ครับ

Re: HTML Input Object สร้างฟอร์ม เพื่อส่งค่าให้ PHP Input object แต่ละประเภท

โดย mindphp » 12/05/2014 6:53 pm

เมื่อมี ฟอร์ม แล้วควรต่อด้วยกระทู้นี้ การส่งค่าจากฟอร์ม ไปให้ php ทำงาน
https://www.mindphp.com/forums/viewtopic ... 29&t=11771

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 5:41 pm

Input Object แบบที่ 11 password

**input ตัวนี้เป็นการสร้างช่องกรอกพาสเวิด ซึ่งจะมองไม่เห็นตัวอักษรที่เรากรอกไป
รูปแบบการสร้าง input แบบ password นั้นเป็น ดังต่อไปนี้ครับ

โค้ด: เลือกทั้งหมด

<input name="ชื่อของtext" type="password" id="ไอดีของtext" value="ค่าของพาสเวิด" />
ตัวอย่าง

โค้ด: เลือกทั้งหมด

<input name="pass" type="password" id="pass" value="1234" />
แนบไฟล์
แบบที่ 11 password.png
แบบที่ 11 password.png (511 ไบต์) Viewed 3477 times

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 5:35 pm

Input Object แบบที่ 10 reset

**input ตัวนี้เป็นการล้างข้อมูลที่เราเคยกรอกไว้ใน From นั้นๆให้หายไป
รูปแบบการสร้าง input แบบ reset นั้นเป็น ดังต่อไปนี้ครับ

โค้ด: เลือกทั้งหมด

<input name="ชื่อของปุ่ม" type="reset" value="ค่าที่แสดงบนปุ่ม" />
ตัวอย่าง

โค้ด: เลือกทั้งหมด

<input name="reset_button" type="reset" value="ล้างข้อมูล" />
แนบไฟล์
แบบที่ 10 reset.png
แบบที่ 10 reset.png (1.03 KiB) Viewed 3477 times

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 5:30 pm

Input Object แบบที่ 9 file

**input ตัวนี้เอาไว้สำหรับ upload file ต่างๆลง server นะครับ
รูปแบบการสร้าง input แบบ file นั้นเป็น ดังต่อไปนี้ครับ

โค้ด: เลือกทั้งหมด

<input type="file" name="ชื่อไฟล์" id="ไอดีไฟล์" />
ตัวอย่าง

โค้ด: เลือกทั้งหมด

<input type="file" name="fileField" id="fileField" />
แนบไฟล์
แบบที่ 9 file.png
แบบที่ 9 file.png (1.19 KiB) Viewed 4241 times

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 5:26 pm

Input Object แบบที่ 8 hidden

รูปแบบการสร้าง input แบบ hidden นั้นเป็น ดังต่อไปนี้ครับ

โค้ด: เลือกทั้งหมด

<input type="hidden" name="ชื่อของ hidden" id="ไอดีของ hidden" value="ค่าต่างๆที่เราต้องการส่งไปหน้า Page อื่นๆ" />
ตัวอย่าง

โค้ด: เลือกทั้งหมด

<input type="hidden" name="type" id="type" value="Car" />

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 5:19 pm

Input Object แบบที่ 7 image

รูปแบบการสร้าง input แบบ image นั้นเป็น ดังต่อไปนี้ครับ

โค้ด: เลือกทั้งหมด

<input type="image" name="ชื่อปุ่มภาพ" id="ไอดีปุ่มภาพ" src="ไฟล์ภาพที่ต้องการจะแสดงเป็นปุ่ม" />
ตัวอย่าง

โค้ด: เลือกทั้งหมด

<input type="image" name="imageField" id="imageField" src="image/2.gif" />
แนบไฟล์
แบบที่ 7 image.png
แบบที่ 7 image.png (3.4 KiB) Viewed 33318 times

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 5:15 pm

Input Object แบบที่ 6 submit

รูปแบบการสร้าง input แบบ submit นั้นเป็น ดังต่อไปนี้ครับ

โค้ด: เลือกทั้งหมด

<input name="ชื่อของปุ่ม"  id="ไอดีปุ่ม" type="submit" value="ค่าของปุ่ม" />
ตัวอย่าง

โค้ด: เลือกทั้งหมด

<input name="register"  id="register" type="submit" value="สมัครสมาชิก" />
แนบไฟล์
แบบที่ 6 summit.png
แบบที่ 6 summit.png (1.12 KiB) Viewed 33318 times

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 5:10 pm

Input Object แบบที่ 5 multiple

**multiple นั้นเป็น select ชนิดหนึ่งที่สามารถเลือกได้หลาย ข้อมูลในเวลาเดียวกัน
รูปแบบการสร้าง input แบบ multiple นั้นเป็น ดังต่อไปนี้ครับ

โค้ด: เลือกทั้งหมด

<select  name="ชื่อของ select input[]" size="จำนวนแถวที่จะโชว์" multiple="MULTIPLE" id="ไอดี select input">
 <option value="ค่าของตัวเลือก1">ตัวเลือกที่ผู้ใช้มองเห็น</option>
 <option value="ค่าของตัวเลือก2">ตัวเลือกที่ผู้ใช้มองเห็น</option>
     </select>
มีการเพิ่ม size="" multiple="MULTIPLE" และ [] หลังชื่อ จาก select เดิมครับ
ซึ่ง ตัว size เป็นตัวกำหนดว่าจะโชว์กี่แถว ส่วน multiple เป็นตัวทำให้เราสามารถเลือกได้หลายข้อมูลพร้อมๆกัน ส่วน [] หลัง name นั้นเป็นการทำให้ค่าที่เราส่งไปเป็น Array

ตัวอย่างที่ 1

โค้ด: เลือกทั้งหมด

<select name="prov"  size="4" multiple="MULTIPLE" id="prov">
       <option value="กรุงเทพฯ">กรุงเทพมหานคร</option>
       <option value="อยุธยา">พระนครศรีอยุธยา</option>
       <option value="อ่างทอง">อ่างทอง</option>
       <option value="สมุทรปราการ">สมุทรปราการ</option>
     </select>
ตัวอย่างที่ 2
เหมือนกับตัวอย่างของ select เลย คือ เลือกไว้อัตโนมัติว่า ผู้ใช้ระบบเคยเลือกจังหวัดอะไรไว้

โค้ด: เลือกทั้งหมด

<select name="prov2"  size="4" multiple="multiple" id="prov2">
       <option value="กรุงเทพฯ" selected="selected">กรุงเทพมหานคร</option>
       <option value="อยุธยา">พระนครศรีอยุธยา</option>
       <option value="อ่างทอง">อ่างทอง</option>
       <option value="สมุทรปราการ">สมุทรปราการ</option>
          </select>
แนบไฟล์
แบบที่ 5 multiple.png
แบบที่ 5 multiple.png (9.37 KiB) Viewed 33317 times

Re: Input Object ในการเขียน PHP แต่ละประเภท

โดย samsonnaze3 » 21/03/2012 4:54 pm

Input Object แบบที่ 4 select

รูปแบบการสร้าง input แบบ select นั้นเป็น ดังต่อไปนี้ครับ
**การใช้ select นั้นมีการเปิด tag ที่ไม่เหมือน input ทั่วไป คือ เริ่มต้นเปิดด้วย <select> แล้วปิดด้วย </select> และมีการใส่รายการข้างในลงไป ด้วยการเปิด tag <option> และปิดด้วย</option>

โค้ด: เลือกทั้งหมด

<select name="ชื่อของ select input" id="ไอดี select input">
   <option value="ค่าของตัวเลือก">ตัวเลือกที่ผู้ใช้มองเห็น</option>
   </select>
ตัวอย่างที่ 1

โค้ด: เลือกทั้งหมด

<select name="prov" id="prov">
   <option value="กรุงเทพฯ">กรุงเทพมหานคร</option>
   <option value="อยุธยา">พระนครศรีอยุธยา</option>
   <option value="อ่างทอง">อ่างทอง</option>
   <option value="สมุทรปราการ">สมุทรปราการ</option>
   </select>
ตัวอย่างที่ 2
เหมือนกับ checkbox และ radio อีกแล้ว ซึ่งเวลาผู้ใช้เคยเลือกจังหวัดไปแล้ว และต้องการกลับมาแก้ไขข้อมูล ระบบจะต้องเลือกจังหวัดที่ผู้ใช้เคยเลือกไว้แบบอัตโนมัติเลย แต่ ใน ส่วนของ select input นั้น เราจะเพิ่ม selected="selected" แทน ซึ่งต่างจาก checkbox และ radio ที่ใช้ checked

โค้ด: เลือกทั้งหมด

<select name="prov2" id="prov2">
      <option value="กรุงเทพฯ" selected="selected">กรุงเทพมหานคร</option>
      <option value="อยุธยา">พระนครศรีอยุธยา</option>
      <option value="อ่างทอง">อ่างทอง</option>
      <option value="สมุทรปราการ">สมุทรปราการ</option>
        </select>
แนบไฟล์
แบบที่ 4 select.png
แบบที่ 4 select.png (7.42 KiB) Viewed 33317 times

ข้างบน