สรุปการทำ Dream เพื่อเชื่อมต่อฐานข้อมูล

สรปุ การสร้างเวบ็ ไซต์เพ่อื เชือ่ มตอ่ ฐานข้อมลู โดย : อาจารย์รัตตกิ านต์ วบิ ลู ยพ์ านิช สาขาวศิ วกรรมซอฟตแ์ วร์ คณะเทคโนโลยสี ารสนเทศ มหาวทิ ยาลัยนอรท์ กรุงเทพ วิชา BSC202 อาจารยร์ ตั ติกานต์ วิบูลยพ์ านชิ

โปรแกรมท่ใี ช้งาน วชิ า BSC202 อาจารยร์ ัตตกิ านต์ วบิ ลู ยพ์ านชิ

การจัดทาฐานข้อมูล1. หลงั จากลงโปรแกรม Apache แลว้ ให้ทา การพิมพท์ ี่ URL : localhost/phpmyadmin2. ทาการกรอก Username : root Password : ของตนเองในห้อง Lab ใช้ root วชิ า BSC202 อาจารย์รัตตกิ านต์ วิบลู ย์พานชิ

การสรา้ งฐานขอ้ มูล 1. ให้ทาการกด New เพ่อื ทาการสรา้ งฐานขอ้ มลู ใหม่ วชิ า BSC202 อาจารยร์ ตั ติกานต์ วบิ ูลยพ์ านิช

การสร้างฐานข้อมูล (ตอ่ )ใส่ช่ือฐานขอ้ มูล กดสร้างฐานขอ้ มลูวิชา BSC202 อาจารยร์ ตั ตกิ านต์ วบิ ลู ย์พานิช

การสร้างตารางฐานขอ้ มลู (ตอ่ )ใสช่ ่ือตาราง จานวนฟลิ ด(์ หัวตาราง) สรา้ งตาราง วิชา BSC202 อาจารยร์ ตั ตกิ านต์ วบิ ูลยพ์ านิช

การสร้างตารางฐานข้อมูล (ตอ่ ) ฟลิ ด์(หัวตาราง)ในตวั อยา่ งมี 5 ฟลิ ด์ 1. ตวั อยา่ งการกาหนดตารางสินคา้ เพอ่ื ใชง้ าน รหัสสินคา้ ช่อื สินคา้ ประเภทสินคา้ จานวนสินค้า ราคาP001 สบู่ อปุ โภค 30 20P002 ยาสีฟัน อปุ โภค 50 30P003 นม บริโภค 40 120 วชิ า BSC202 อาจารย์รัตติกานต์ วบิ ูลย์พานิช

การสร้างตารางฐานข้อมลู (ตอ่ ) การวิเคราะห์ชนิดของข้อมูลดงั นี้ 1. INT เหมาะสาหรับขอ้ มลูจากตารางตวั อยา่ ง นามาสรา้ งฐานข้อมลู ไดด้ ังนี้ ฟลิ ด(์ หัวตาราง) ชนดิ ของข้อมูล ใชใ้ นการคานวณ 2. VARCHAR เหมาะสาหรับ วิชา BSC202 อาจารย์รัตตกิ านต์ วบิ ูลยพ์ านิช ขอ้ มูลที่เปน็ ตัวอักษร/ตวั เลข ท่ไี ม่ได้ใช้ในการคานวณ 3. TEXT เหมาะสาหรบั ข้อมูล ตัวอกั ษรที่มคี วามยาวมาก 4. DATE ข้อมลู วันที่ 5. DECIMAL ขอ้ มูลตัวเลขทศนิยม

การสรา้ งตารางฐานขอ้ มูล (ตอ่ ) ความยาวของขอ้ มลู1. ระบคุ วามยาวของข้อมลู ที่จะใชง้ าน2. กด SAVEวิชา BSC202 อาจารยร์ ัตติกานต์ วบิ ูลย์พานชิ

การแก้ไขโครงสรา้ งของตารางข้อมูล (เมนู Structure) แก้ไขฟลิ ด(์ หัวตาราง) ลบฟิลด์(หัวตาราง) วิชา BSC202 อาจารย์รัตตกิ านต์ วิบูลยพ์ านิช

การแทรกขอ้ มลู ไปยงั ตารางที่สรา้ ง (เมนู Insert)วิชา BSC202 อาจารยร์ ตั ติกานต์ วิบูลย์พานชิ แทรก Value บนั ทกึ ข้อมูล

ผลลพั ธ์ เรยี กดขู อ้ มูลจาก (เมนู Browse) วิชา BSC202 อาจารยร์ ัตตกิ านต์ วบิ ลู ยพ์ านิช

ขัน้ ตอนการใชง้ าน Dreamweaver1. เปดิ โปรแกรม Dreamweaver2. เขา้ ไปที่เมนู Site > New Site…3. Site Name : ระบุช่อื ของตนเอง หรอื ชอ่ื ที่สอดคลอ้ งกับงานท่ที า4. Local Site Folder : ใหส้ ร้างโฟลเดอรใ์ หมใ่ น Drive C:\AppServ\www\โฟลเดอร์ใหม่5. กด Saveหมายเหตุ : หากมีโฟลเดอร์งานอยู่แล้วให้ทาการนาโฟลเดอร์งานไปไว้ที่ C:\AppServ\www\โฟลเดอรง์ าน จากนน้ั ใน Local Site Folder ให้ทาการเลือกไปยงั โฟลเดอร์ดงั กลา่ ว วิชา BSC202 อาจารยร์ ัตติกานต์ วิบลู ย์พานชิ

การเช่ือมต่อฐานข้อมลู1. ใหส้ รา้ งไฟล์ขึ้นมาใหม่ โดยการคลกิ ขวาที่ Site ของตนเอง เลือก New File วชิ า BSC202 อาจารยร์ ตั ตกิ านต์ วิบลู ยพ์ านิช

การเชอ่ื มตอ่ ฐานข้อมูลจากโปรแกรม Dreamweaver2. ทาการต้ังช่ือไฟล์ว่า Config.php (ไฟล์นี้จาเป็นมากเน่ืองจากเป็นไฟล์ที่ใช้Connect database) หมายเหตุ : จาเป็นต้องลงท้ายดว้ ย .php เนื่องจากเราจะทาการเขียนโค้ดที่เป็นภาษา php ดังน้ันหากไม่ทาการเปลี่ยนแปลงนามสกุลไฟล์จะทาใหไ้ ม่สามารถเช่ือมต่อฐานขอ้ มูลได้เนือ่ งจากไฟลต์ ั้งตน้ เป็น .html โค้ดที่เขียนท้งั หมดจะออกมาเป็นขอ้ ความ วิชา BSC202 อาจารย์รัตตกิ านต์ วบิ ูลย์พานิช

การเชื่อมตอ่ ฐานขอ้ มลู (ตอ่ )ไฟล์ Config.php วชิ า BSC202 อาจารยร์ ตั ติกานต์ วบิ ลู ย์พานชิ

การประยกุ ต์ใชง้ านฐานขอ้ มลู กับการLogin1. สร้างหน้า Login.php2. นา Text Field มาจาก เมนู Window > Insert > Formsหมายเหตุ : การเลือก TextField มาใช้จะมีแถบเส้นประสีแดงท่ีครอบอยู่ ห้ามลบเดด็ ขาด วิชา BSC202 อาจารยร์ ัตตกิ านต์ วิบูลยพ์ านิช

การประยกุ ต์ใช้งานฐานข้อมลู กับการLogin3. จากน้ันทาการคลกิ ไปยัง Text Field แล้วทาการตัง้ คา่ วตั ถุ เชน่ TextField : ตงั้ ชื่อวา่ Username Max chars : ความยาวตวั อกั ษร หมายเหตุ : ในกรณีเป็น Password ใหท้ าการคลิกเลือก Password วชิ า BSC202 อาจารย์รตั ติกานต์ วบิ ลู ยพ์ านิช

การประยกุ ต์ใช้งานฐานขอ้ มูลกบั การLogin4. จากน้ันทาการเขา้ ไปยังเมนู Code วชิ า BSC202 อาจารยร์ ตั ตกิ านต์ วิบูลยพ์ านิช

การประยกุ ตใ์ ช้งานฐานข้อมลู กับการLogin5. ไปยังบรรทัดทีเ่ ปน็ ส่วนของ Text Field เพ่ือทาการส่งค่าไปยังหน้าตรวจสอบ พิมพ์หนา้ ตรวจสอบ (Checklogin.php) วิชา BSC202 อาจารยร์ ตั ติกานต์ วบิ ลู ยพ์ านชิ

การตรวจสอบขอ้ มูลLogin จากฐานขอ้ มลู1. ในหน้านีจ้ ะทาการเชก็ ว่า Username และ Password ท่ผี ู้ใชก้ รอกเขา้ สู่ ระบบ มตี วั ตนอยู่ในฐานข้อมูลหรอื ไม่2. ทาการสรา้ งหน้า Checklogin.php วิชา BSC202 อาจารยร์ ตั ติกานต์ วบิ ูลย์พานชิ

การตรวจสอบข้อมูลLogin จากฐานข้อมลู (ตอ่ )3. หนา้ Checklogin.php ไปยังเมนู Code เขยี นโคด้ ดังนี้ วิชา BSC202 อาจารยร์ ตั ติกานต์ วบิ ลู ยพ์ านชิ

การตรวจสอบขอ้ มลู Login จากฐานข้อมลู (ตอ่ )อธบิ าย Checklogin.php1. ใช้สาหรบั ส่งั ใหอ้ า่ นข้อมลู จากฐานข้อมูลเปน็ ภาษาไทย2. เปดิ แทก็ ภาษา php3. Include “config.php”; เป็นการเปดิ ใช้งานตวั เช่อื มต่อฐานข้อมลู หมายเหตุ : จะใชแ้ บบน้ีในทุก ๆ หนา้ ที่มีการเชอื่ มต่อฐานขอ้ มูล4. $username เป็นตวั แปรที่ใชเ้ กบ็ คา่ การส่งข้อมูลมาจากหน้า Login.php$_POST[‘username’]; เปน็ การรบั ค่าผา่ นเมธอด POST ซ่ึงใช้สาหรบั การส่งขอ้ มูลขา้ มหนา้โดยให้ [‘username’]; มีค่าเท่ากบั ตัวแปรท่ีต้ังค่าวัตถุ วิชา BSC202 อาจารยร์ ตั ตกิ านต์ วิบลู ย์พานชิ

การตรวจสอบข้อมูลLogin จากฐานขอ้ มูล (ตอ่ ) คาสั่ง Query ขอ้ มลู จาก SQL อา้ งองิ การเรียนการสอนผา่ นอธบิ าย Checklogin.php ทาง Facebook กลุม่ bsc2025. เช่นเดียวกับขอ้ 4 แต่เป็น Password 1 27. $sql = \"select * from user where username='$username' and password='$password’ “;หมายถงึ เลือกทั้งหมดจากตาราง user โดยมีเงื่อนไขวา่ ให้ username 1 หมายถึงชือ่ ฟลิ ด์ในฐานข้อมูล‘$username’ 2 หมายถึง ช่ือตัวแปรที่ประกาศเพ่ือใช้ในการรับค่าผ่านเมธอด POST ค่า 2 ค่าต้องเหมือนกนั8. คาส่ังให้ Query ข้อมูลตามคาสั่งจากบรรทัดที่ 79. คาสง่ั ให้ทาการคน้ หาขอ้ มูลใน Database เพื่อเปรียบเทียบข้อมูล10. หากข้อมูลถกู ตอ้ งครบถว้ นตามเงื่อนไข ให้ทาการเปิดหน้า index.php วิชา BSC202 อาจารยร์ ตั ติกานต์ วิบูลยพ์ านชิ

การนาข้อมลู จากฐานข้อมูลมาแสดง 1. สงั่ ใหแ้ สดงขอ้ มลู เปน็ ภาษาไทย 2. Include “config.php”; เป็นการเปดิ ใช้งานตัวเชอ่ื มต่อฐานข้อมลู หมายเหตุ : จะใช้แบบน้ใี นทุก ๆ หนา้ ท่ีมีการเชือ่ มตอ่ ฐานข้อมูล 3. คาสั่ง Query ฐานขอ้ มูล ใหท้ าการเลือกทงั้ หมดจากตารางสินค้า (product) 4. คาสั่งเพ่อื ทาการตรวจดู (นับขอ้ มลู ในฐานขอ้ มลู ) 5. คาส่ังวนรปู เพอ่ื ดงึ ขอ้ มลู ทง้ั หมดจากฐานขอ้ มูล 6. { เร่ิมตน้ การแสดงข้อมูล7. ให้แสดงข้อมูลผา่ นทางหน้าจอโดยนาข้อมลู id มาแสดง หมายเหตุ : [“id”] ตอ้ งตรงกับฐานข้อมลู ตัวเลก็ ตวั ใหญ่มีผล8. เช่นเดียวกับข้อ 7 เพียงแต่นาฟิลด์อ่นื มาแสดง9. } ปดิ การดึงข้อมลู จากฐานข้อมลู10. ปิดแท็ก วิชา BSC202 อาจารย์รัตติกานต์ วิบูลยพ์ านชิ

การจัดการขอ้ มลู ประกอบไปดว้ ยการทางาน 3 ส่วนไดแ้ ก่ 1. การแสดงข้อมูลเดิมทมี่ ใี นฐานข้อมูล 2. คาส่ังเพื่อไปยงั หน้าแกไ้ ขขอ้ มลู 3. คาสัง่ เพ่ือไปยังหน้าลบขอ้ มลู วิชา BSC202 อาจารยร์ ตั ติกานต์ วบิ ูลย์พานชิ

หนา้ แสดงขอ้ มลู หากตอ้ งการใหข้ ้อมูลแสดงในรูปของตาราง ใหท้ าการแยกตรงส่วน ของ echo $r[“id”]; ออกเปน็ สว่ น ๆ ไปยังตารางเชน่ <? echo $r[“id”]; ?> วชิ า BSC202 อาจารย์รตั ตกิ านต์ วบิ ูลยพ์ านิช

หน้าแสดงข้อมลูโคด้ ในส่วนของรูปภาพเพอื่ ใช้ทาการเช่อื มโยงข้อมลู ไปยังหนา้ ถัดไป<a href=\"edituser.php?user_id=<?=$r[\"user_id\"];?>\"><img src=\"image/edit.gif\" width=\"30\" height=\"30\" /></a>กาหนดให้ลิงคไ์ ปยงั หน้า edituser.php โดยให้ user_idมีคา่ เท่ากับ $r[“user_id”]; ในฐานข้อมูล กาหนดให้ใชง้ านรปู ภาพจากโฟลเดอร์ image ชอ่ื ไฟลภ์ าพ edit.gif มีขนาดความกว้าง 30 และสูง 30 วชิ า BSC202 อาจารยร์ ัตติกานต์ วิบลู ยพ์ านิช

หนา้ แกไ้ ขขอ้ มูล (edituser.php) 1. สง่ั ให้แสดงขอ้ มลู เปน็ ภาษาไทย 2. Include“config.php”; เป็นการเปิดใช้งานตวั เชือ่ มตอ่ ฐานข้อมลู หมายเหตุ : จะใชแ้ บบนใี้ นทกุ ๆ หน้าทมี่ กี ารเช่อื มต่อฐานขอ้ มลู3. เขียนเพื่อเตรียมตัวส่งค่าไปยังหน้าใช้ในการบันทึกข้อมูลลงฐานข้อมูล (saveedituser.php) โดยให้ user_id มีค่าเท่ากับ $_GET[“user_id”]; ท่ีรับมาจากหน้าที่แล้วผา่ น icon แกไ้ ข4. คาส่ัง SQL ใหท้ าการเลอื กข้อมลู ทั้งหมดจากตาราง user โดยมเี ง่อื นไขว่าให้ user_id ในฐานข้อมูลมคี า่ เท่ากับข้อมลู ทส่ี ง่ มาจากหนา้ ทแี่ ลว้ ผา่ นเมธอดGET5. Query ข้อมลู6. วนรูปขอ้ มลู จากฐานข้อมลู7. ถ้าไมเ่ จอขอ้ มลู บรรทดั ที่ 9 ใหท้ าการแสดงข้อความวา่ ไม่เจอข้อมลู จากรหัสนี้ วชิ า BSC202 อาจารย์รตั ตกิ านต์ วิบูลย์พานิช

บนั ทึกการแก้ไข (saveedituser.php) วิชา BSC202 อาจารย์รัตตกิ านต์ วิบลู ยพ์ านชิ

การลบข้อมลู วิชา BSC202 อาจารยร์ ตั ติกานต์ วบิ ลู ย์พานชิ

การบนั ทกึ งาน1. ให้ไปทเี่ มนู File > Save All.. จากนัน้ ทาการ Save ทง้ั หมดไวท้ ่ี C:\AppServ\www\โฟลเดอรง์ าน2. การ Run ใหพ้ ิมพ์ท่ี URL : localhost/โฟลเดอรง์ าน/ไฟลง์ าน. เชน่ localhost/rattikan/login.php วชิ า BSC202 อาจารย์รตั ตกิ านต์ วบิ ลู ย์พานชิ

การบนั ทึกฐานข้อมลู ไปใชง้ าน1. ไปท่เี มนู Export (ส่งออก) จากนน้ั ทาการเลือกเปน็ SQL และทาการเปลี่ยนชอื่ ไฟลด์ ้านล่าง เลอื กเปน็ .Zip2. จากนนั้ ทาการเลอื กทีเ่ กบ็ ไฟล์โดยเกบ็ ไว้รวมกนั ท่ี C:\AppServ\www\โฟลเดอรง์ าน วชิ า BSC202 อาจารยร์ ตั ติกานต์ วบิ ูลยพ์ านิช

วชิ า BSC202 อาจารยร์ ัตตกิ านต์ วิบลู ย์พานชิ