เพิ่มข้อมูลใสฐานข้อมูล PHP+MySQL

สอนเพิ่มข้อมูลลงในฐานข้อมูล ด้วยโปรแกรม Dreamweaver + Spry (PHP + MySQL)

เพิ่มข้อมูลลงในฐานข้อมูลด้วยโปรแกรมDreamweaver
      หลังจากที่ผมได้สอนดึงข้อมูลในฐานข้อมูลมาแสดงไปแล้ว  คือ แสดงข้อมูลจากฐานข้อมูล, แสดงและแบ่งหน้าข้อมูล และแสดงข้อมูลใน Select(List/Menu)
      คราวนี้จะสอนเพิ่มข้อมูลลงในฐานข้อมูลบ้างครับ ซึ่งในโปรแกรมDreamweaverเองก็มีOption จำพวก Insert Record, Update Record, Delete Record อยู่ครับ แต่บทความนี้จะสอนใช้งาน Insert Record ก่อนนะครับ ส่วนที่เหลือจะทยอยสอนในบทความต่อไป
      เริ่มกันเลยนะครับ อันดับแรกให้สร้างไฟล์ .php ขึ้นมา 2 ไฟล์ คือไฟล์ add.php และ add_succ.php
ไฟล์ add.php -> เราจะสร้างฟอร์มกรอกข้อมูล และให้Dreamweaverสร้างโค๊ดPHP เพื่อประมวลผลและบันทึกข้อมูลลงในฐานข้อมูล ในไฟล์นี้ครับ ...ให้ทำตามขั้นตอนดังนี้
+++ ให้ออกแบบฟอร์มให้มีหน้าตาดังรูป โดยไปที่แถบ Spry แล้วเลือก Input ต่างๆ ดังรูป
1.เลือก Input TextField สำหรับกรอกชื่อสินค้า
2.เลือก Input Select(List/Menu) ให้ทำตามในบทความนี้เลยครับ แสดงข้อมูลใน Select(list/menu)
3.เลือก Input TextField สำหรับกรอกจำนวนสินค้า
4.เลือก Input TextField สำหรับกรอกราคาสินค้า
5.เลือก  TextArea สำหรับรายละเอียดของสินค้า
6.ปุ่มเพิ่มสินค้า (โทดที..ลืมติดหมายเลข ^_^'')

+++ จากนั้นให้ตั้งชื่อให้กับ Input ของเราครับ โดยเราจะต้องตั้งชื่อให้ตรงกับฟิลด์ในฐานข้อมูลของเรา ดูจากตัวอย่างดังรูป ซึ่งก็คือ Input ชื่อสินค้า ฟิลด์ที่ใช้เก็บชื่อสินค้าในฐานข้อมูล คือ pd_name ครับ สำหรับ Input ตัวอื่นๆ ก็ใช้หลักการนี้เหมือนกันครับ



+++ จากนั้น เราจะใช้ Spry ของ Dreamweaver เพื่อตรวจสอบความถูกต้องของการกรอกข้อมูลด้วยครับ
+++ เราจะทำ Input ทีละตัวนะครับ โดย Input ตัวแรกคือ ชื่อสินค้า เราจะใช้ Spry บังคับไม่ให้กรอกข้อมูลที่เป็นค่าว่างครับ ให้ทำตามขั้นตอนดังรูป



1.คลิกที่ Spry Textfield ชือสินค้า
2. เลือก Preview States
3.คลิกเลือก Required
4.แก้ไขข้อความแจ้งเตือนให้เป็นภาษาไทย

+++ Input ตัวต่อไปคือ Select(List/Menu) สำหรับเอาไว้ให้เลือกหมวดสินค้าครับ โดยเราจะดึงข้อมูลจากเทเบิลหมวดสินค้ามาแสดงก่อน โดยให้ทำตามบทความนี้ก่อนครับ แสดงข้อมูลใน Select(List/Menu) จากนั้นให้ทำตามขั้นตอนดังรูป


+++ Input ต่อไปคือ Input TextField สำหรับกรอกจำนวนสินค้า โดยเราจะให้ Spry ตรวจสอบข้อมูลต้องไม่เป็นค่าว่างและต้องกรอกข้อมูลที่เป็นตัวเลขเท่านั้น ให้ทำตามขั้นตอนดังรูป


ตรวจสอบการกรอกข้อมูลจำนวนสินค้าห้ามเป็นค่าว่าง

ตรวจสอบการกรอกข้อมูลจำนวนสินค้าต้องเป็นตัวเลขเท่านั้น
ปล.สำหรับราคาสินค้าให้ทำเหมือนจำนวนสินค้าเลยครับ
+++ Input ตัวสุดท้าย คือ TextArea เราจะใช้ Spry ตรวจสอบการกรอกข้อมูลห้ามเป็นค่าว่างและข้อความต้องไม่ต่ำกว่า 5 ตัวอักษร ให้ทำตามขั้นตอนดังรูป
+++ จากนั้นเราจะให้Dremweaverสร้างคำสั่ง Insert Record โดยไปที่แท็บ SERVER BEHAVIORS ทำตามขั้นตอนดังรูป
+++ ปรากฎหน้าต่าง Insert Record ให้ทำตามขั้นตอน ดังรูป

1.เลือกฟอร์ม (ฟอร์มของผมชื่อ form1)
2.เลือกการเชื่อมต่อกับฐานข้อมูล โดยศึกษาเพิ่มเติมได้จากที่นี่-> การสร้างการเชื่อมต่อกับฐานข้อมูล
3.เลือกเทเบิลที่เราจะ Insert ข้อมูลเข้าไป โดยที่ผมเลือก tb_product (เทเบิลสินค้า)
4.เลือกไฟล์ที่จะแสดงหลังจากที่ Insert ข้อมูลเสร็จสมบูรณ์แล้ว โดยผมเลือกไฟล์ add_succ.php

+++ ไฟล์ add_succ.php ให้พิมพ์โค๊ด HTML ธรรมดาๆ ดังนี้
view plainprint?
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=windows-874" />  
  5. <title>Untitled Document</title>  
  6. </head>  
  7. <body>  
  8. <strong><center>เพิ่มสินค้าเรียบร้อยแล้ว  
  9.   
  10.   <a href="add.php">กลับไปหน้าเพิ่มสินค้า</a>  
  11. </center>  
  12. </strong>  
  13. </body>  
  14. </html>  

ก็จะได้ผลลัพธุ์ดังนี้

ผมขอยอมรับว่าบทความนี้ผมเขียนได้ไม่ดีซักเท่าไหร่ครับ (รวมถึงบทความอื่นๆด้วย 555)
หากสงสัยหรือติดปัญญาตรงไหน สามารถสอบถามผมได้จากช่องCommentได้เลยนะครับ

ไม่มีความคิดเห็น:

แสดงความคิดเห็น

สมัครสมาชิก: บทความ (Atom)