About DwThai.Com 00

DwThai.Com Logo

DwThai.Com

Tip and Trick Dreamweaver

ก่อตั้งเมื่อปีพุทธศักราช ๒๕๔๖





ค้นหาข้อมูลใน DwThai.Com

การสร้างโปรแกรมสำหรับการค้นหา (Search) ข้อมูลจาก Database [Article ID : 211]


เรื่อง : การสร้างโปรแกรมสำหรับการค้นหา (Search) ข้อมูลจาก Database

บทความนี้คงถูกอกถูกใจของใครหลายคนเป็นแน่ เพราะว่ามีการร้องขอมาให้ช่วยเขียนให้นานแล้ว ผมเองก็ได้รับปากไว้ แต่ไม่ได้จัดทำให้เสียที มาครั้งนี้อารมณ์ดี เลยหยิบยกมาเขียนให้ได้ลองอ่านกัน ออ..ลืมบอกไป โปรแกรมนี้ใช้ PHP กับ MySQL ครับ

วิธีการสร้างโปรแกรมสำหรับการค้นหาข้อมูล

1. ให้คุณทำการสร้าง Database พร้อมทั้ง Table ขึ้นมากับ MySQL (หรือถ้าใครมี Table ที่ต้องการสร้างโปรแกรมค้นหาอยู่แล้วก็ข้ามขั้นตอนนี้ไปได้) ซึ่งในบทความนี้ผมใช้ Table ชื่อว่า product_list เป็นตัวอย่าง และมีโครงสร้างของตาราง ดังนี้

ตาราง product_list
Columns Data type
prod_id int(2) auto_increment PK
prod_name varchar(50)
prod_price float(4,2)
ตารางเก็บข้อมูลรายการสินค้า


เมื่อได้ตารางข้อมูลแล้ว ให้คุณทำการสมมุติกรอกข้อมูลลงไปสัก 4-5 Records

2. จากนั้นให้เราทำการสร้างไฟลืใหม่ขึ้นมา 1 ไฟล์ทำการ Save ในที่นี้ผมให้ชื่อไฟล์ว่า form_search.php ที่ฟอร์มนี้ให้คุณทำการสร้าง Form Input ลงไปตามตัวอย่าง ดังนี้


ที่ Text input ให้ชื่อ input นี้ว่า word Action ของ Form ให้ทำการพิพม์ชื่อไฟล์ชื่อว่า search_result.php ลงไป ดังรูป



3. เมื่อเราได้ทำการสร้างไฟล์ form_search.php เสร็จสิ้นแล้ว ให้เราทำการสร้างไฟล์ใหม่ขึ้นมาอีก 1 ไฟล์ โดยไฟล์นี้ให้ชื่อว่า search_result.php จากนั้นที่ไฟล์นี้ ให้คุณทำการสร้าง MySQL Connection ขึ้นมา (อ่านเรื่องการสร้าง Connection ได้จากบทความเก่านะครับ)
4. เมื่อได้ทำการสร้าง MySQL Connection แล้ว จากนั้นให้เราทำการเปิดหน้าต่าง Server Behaviors ขึ้นมา โดยไปที่
Main Menu ->Window -> Server Behaviors

5. เมื่อเปิดหน้าต่างดังกล่าวขึ้นมาแล้ว ให้เราทำการ Click ไปที่เครื่องหมายบวก (+) แล้วให้เลือกไปที่เมนู RecordSet ดังรูป


6. จากนั้นโปรแกรมจะทำการเปิดหน้าต่างใหม่ขึ้นมา ดังรูป ให้เราเซ็ทค่าต่าง ๆ ดังนี้



การกำหนดค่าใน RecordSet
Fields Name Value
Name ชื่อของ Recordset ใช้เป็น search
Conction เลือกไปที่ชื่อ Connection ที่เราสร้างไว้
Columns All
Filter
(สำหรับการกรองข้อมูลที่จะแสดง)
- prod_name เพราะเราต้องการค้นหาจาก Column นี้ใน Table
- Contains ค้นจากทุกตำแหน่งของข้อมูล
- Form Varible : word
(word เป็นชื่อที่ได้มาจาก Text input ที่เราสร้างจากข้อที่ 2)
Sort None (หากไม่ต้องการจัดเรียงข้อมูล)
 
7. เมื่อเราได้ทำการสร้าง Recordset แล้ว จากนั้นให้เราทำการ Click ไปที่ icon ที่ชื่อว่า Dynamic Table ซึ่งอยู่ใน Tab Application ดังรูป


8. เมื่อกดไปที่เมนูดังข้อที่ 7 แล้ว โปรแกรมจะทำการเปิดหน้าต่างขึ้นมาให้เรากำหนดค่า ดังนี้


การกำหนดค่าใน Dynamic Table
Fields Name Value
Recordset
เลือกชื่อ Recordset ที่เรากำหนดไว้
search
Show
เลือกจำนวนการแสดงผลข้อมูล
All records
Border, Cell padding - spacing กำหนดตามต้องการ
 
9. เมื่อทำการกำหนดค่าต่าง ๆ เสร็จสิ้นแล้ว ให้เราทำการดูผล โดยให้ทำการเรียกไฟล์ form_search.php กับ Web Server จากนั้นทำการพิมพ์ข้อมูลที่ต้องการค้นหาใน Input กดปุ่ม Search แล้วดูผลลัพธ์การแสดงผล ว่ามีการค้นหาและแสดงผลให้ได้ถูกต้องหรือไม่....ลองนำไปประยุกติ์ใช้งานกันดูกับเว็บไซต์จของคุณ

10. จบขั้นตอนการสร้างโปรแกรมค้นหาข้อมูลใน Database ครับ
ปล. อย่าลืม..ขณะทำการสร้างโปรแกรมต้องเปิดโปรแกรม Web Server และ MySQL ด้วยนะครับ

คลิปประกอบบทความ

Dreamweaver Database (PHP/MySQL) ตอนที่ 10 โปรแกรมค้นหาข้อมูล

About the Author
Mr.Sittichai Raksasuk

Mr.Sittichai Raksasuk

Sittichai is a Web Developer and Web Technology Instructor for over 10 yrs. He is also a webmaster of dwthai.com and author jQuery with Dreamweaver (2010). DwThai.Com is a website for web developer using Adobe Dreamweaver.

Contact with him : dwthai@gmail.com



บทความอื่นที่คุณอาจสนใจ

เก็บ Code ที่ชื่นชอบไว้ใช้นาน ๆ (Snippets Panel)

เรื่อง : การเก็บโค้ดโปรแกรมไว้ใช้กับโปรแกรม Dreamweaver เคยมีแฟนเว็บบางท่านเข้ามาถามว่า "พี่มีวิธีเก็บโค้ดที่เร...  

สร้างโปรแกรม Guestbook ด้วย Dreamweaver + PHP + MySQL ตอนที่ 4 [จบ]

ในตอนที่ 3 ที่ผ่านมาเราได้ทำการสร้างตารางสำหรับการแสดงผลเตรียมรอไว้แล้ว มาในตอนที่ 4 นี้ เราจะมาทำการสร้างโปรแกรมสำหรับให้ผู้เยี่ย...  

การสร้างโปรแกรมสำหรับการ Insert ข้อมูล

เรื่อง :: การสร้าง Web Application ด้วย Dreamweaver + PHP + MySQL ตอนที่ 3จากที่ 2 บทความที่แล้วเราได้ทำการเตรียมสร้าง Dat...  

มาเปิดใช้งาน Standard Toolbars เพื่อ Save File ได้อย่างสะดวกกันเถอะ

เรื่อง: เปิดใช้ Standard Toolbars ในโปรแกรม Dreamweaver Standard Toolbars เป็นเครื่องมือที่จะช่วยให้ผู...  


Copyright ©2003-2019 dwthai.com. All rights reserved.
This website was created by : S.raksasuk.

ติดต่อ DwThai.Com

e-mail : dwthai@gmail.com
mobile: 08-9495-7296

เขียน Guestbook : DwThai.Com

*
*
*