Doc2

เอกสารฝกปฏบต การเขยนโปรแกรมบนเวบ 130

บทท 6 Dreamweaver กบการตดตอฐานขอมล

เราไดผานขนตอนการก าหนดเวบไซตส าหรบ PHP มาแลว แตหากเราตองการพฒนา PHP แอพพลเคชนทมการเรยกใชฐานขอมล กตองสรางการตดตอกบฐานขอมลซะกอน เนอหาในบทนจะกลาวถงการก าหนดให Dreamweaver ตดตอกบฐานขอมล หลงจากนนเราจะเรมการพฒนา PHP เวบเพจทสามารถเรยกใชขอมลจากระบบฐานขอมลมาแสดงผลบนเวบเพจ

สรางฐานขอมล หากเราตองการพฒนา PHP แอพพลเคชนทมการเรยกใชฐานขอมล กตองมการสรางฐานขอมลซะกอน ขนตอนนจะเปนการสรางฐานขอมลตวอยางจากไฟลตนแบบ

ขนตอนการสรางฐานขอมล: 1. เปด Internet Explorer ไปท URL http://localhost หลงจากนนคลกเขาใชงานโปรแกรม phpMyAdmin ดงรป

รปแสดงการเปด Internet Explorer ไปท URL http://localhost


2. ใสชอผใช (User name) และรหสผาน (password) ซงมาจากขนตอนการตดตง AppServe

User name : root Password : root

3. สรางฐานขอมลใหมชอ "human" โดยระบชอในชอง สรางฐานขอมลใหม ดงรป

รปแสดงการสรางฐานขอมลใหม

ตงชอฐานขอมล


ใช MySQL ในการสรางฐานขอมล CREATE DATABASE human; 3. สรางตารางในฐานขอมลตวอยางโดย ตงชอตาราง employee ดงรป

สรางตารางชอ employee

ใหปอนรายละเอยด field เพอเกบขอมลดงน ท ชอฟลด ชนด(ขนาด) Key หมายเหต 1 emp_id varchar(5) Primary key รหสพนกงาน 2 name Varchar(20) ชอพนกงาน 4 lastname Varchar(20) นามสกล 5 gender Varchar(10) เพศ 6 date_born Date วนเดอนปเกด 7 Salary Decimal(10,0) เงนเดอน 8 dept_id varchar(2) FK : department รหสแผนก 9 address Varchar(255) ทอย 10 photo Varchar(50) ไฟลรปภาพ ใช MySQL ในการสรางฐานขอมล CREATE TABLE employee ( emp_id varchar(5) PRIMARY KEY NOT NULL, name varchar(20), lastname varchar(20), gender Varchar(10), date_born date,


salary decimal(10,0) , dept_id varchar(2) , foreign key(dept_id) references department(dept_id), address varchar(255) , photo varchar(50) , ); สรางตารางชอ department

ประกอบดวย ท ชอฟลด ชนด(ขนาด) Key หมายเหต 1 dept_id varchar(2) Primary key รหสแผนก 2 deptname Varchar(50) ชอแผนก

ใช MySQL ในการสรางตาราง CREATE TABLE department` ( dept_id varchar(2) PRIMARY KEY not null , deptname varchar(50), ) ; การตดตอกบฐานขอมล (Database Connection) เราไดผานขนตอนการก าหนดเวบไซตส าหรบ PHP และสรางฐานขอมลมาแลว แตหากเราตองการพฒนา PHP แอพพลเคชนทมการเรยกใชฐานขอมล กตองสรางการตดตอกบฐานขอมลซะกอน ขนตอนนจะเปนการก าหนดให Dreamweaver ตดตอกบฐานขอมล เพอทเราจะไดพฒนา PHP เวบเพจทสามารถเรยกใชขอมลจากระบบฐานขอมลไดนนเอง


การตดตอฐานขอมล ในเอกสารนน าเสนอ 2 วธคอ 1. การเขยนค าสง 2. การไมเขยนค าสง โดยใชความสามารถของ dreamweaver

การตดตอฐานขอมล โดยใชค าสง

1 2 3 4 5 6 7 8

<?php $hostname_dbconn = "localhost"; //database server $database_dbconn = "personal"; //ชอฐานขอมล $username_dbconn = "root"; //ชอผใช $password_dbconn = "root"; //รหสผาน $dbconn = mysql_pconnect($hostname_dbconn, $username_dbconn, $password_dbconn) or trigger_error(mysql_error(),E_USER_ERROR); //การเชอมตอ mysql_query ("SET NAME TIS620"); //ภาษาไทยในฐานขอมล ?>

การตดตอกบฐานขอมล (Database Connection) การไมเขยนค าสง โดยใชความสามารถของ dreamweaver เราไดผานขนตอนการก าหนดเวบไซตส าหรบ PHP และสรางฐานขอมลมาแลว แต

หากเราตองการพฒนา PHP แอพพลเคชนทมการเรยกใชฐานขอมล กตองสรางการตดตอ

กบฐานขอมลซะกอน ขนตอนนจะเปนการก าหนดให Dreamweaver ตดตอกบฐานขอมล

เพอทเราจะไดพฒนา PHP เวบเพจทสามารถเรยกใชขอมลจากระบบฐานขอมลไดนนเอง

ขนตอนการตดตอกบฐานขอมล (Database Connection): 1. เรมตนการตดตอกบฐานขอมล "human" ใน Dreamweaver โดยการคลกทเมน Window -> Databases คลกทเครองหมายบวก เลอก MySQL Connection ดงรปดานลาง


รปแสดงเมน MySQL Connection ส าหรบสรางการตดตอกบฐานขอมล

2. กรอกขอมลสรางการตดตอฐานขอมล (Database Connection) ดงรายละเอยดตอไปน Connection Name: dbconn MySQL Server: localhost Username: root (หรอตามทก าหนด) Password: ชองวาง (หรอตามทก าหนด) Database: human

รปแสดงไดอะลอก MySQL Connection ส าหรบสรางการตดตอกบฐานขอมล


จากนนกดปม OK และกลบมาทหนา MySQL Connection

3. คลกปม เพอทดสอบการตดตอฐานขอมล หากการตดตอฐานขอมลส าเรจ จะปรากฏขอความ Connection was made successfully แสดงขนมา ใหคลกปม OK ออกไป

4. ท Databases Panel จะปรากฏรายการตดตอฐานขอมลชอ dbconn แสดงใหเหน ดงรป กแสดงวาสามารถตดตอฐานขอมลส าเรจแลว


รปแสดง Databases panel หลงจากตดตอกบฐานขอมลแลว


บทท 7 การก าหนดไซตใน Dreamweaver

การก าหนดไซต (Site Definition) คอ การก าหนดคาเรมตนในโปรแกรม Dreamweaver ส าหรบการพฒนาแตละเวบแอพพลเคชน กลาวคอ หากตองการใชงาน Dreamweaver ในการพฒนาเวบแอพพลเคชน 1 ระบบงานกตองก าหนดไซต เพมขนมาอก 1 เวบไซต หรออก 1 โปรเจคตนนเอง ในขนตอนนจะอธบายถงวธการน าเอาไฟลตวอยาง มาตดตงในไดเรคทอรของ Apache เวบเซรฟเวอร ซงจากขนตอนการตดตง PHP แอพพลเคชนเซรฟเวอรโดยใชชดโปรแกรม AppServ เวบไดเรคทอรของ Apache เวบเซรฟเวอรจะถกก าหนดไวทC:\AppServ\www\

ขนตอนการก าหนดไซต PHP ใน Dreamweaver : 1. ในการก าหนดไซต ใหพจารณาวาจะจดโครงสรางในการเขาถงโปรแกรมและขอมลอยางไรในไซต

รปท 3 การก าหนดไดเรกทอร

จากรปท 3 ใหเราสรางไดเรกทอรชอ PERSON ซงเปนไซตหลก ทสรางอยใน C:\AppServ\www จากนนท าการสรางไดเรกทอรยอยทอยในไดเรกทอร PERSON เพอเกบโปรแกรม (program) รปขอมล (photos) และรปภาพส าหรบตกแตงหนาเวบ (images) 2. เปดโปรแกรม Dreamweaver แลวไปทเมน Site -> Manage Sites… 3. เมอปรากฏไดอะลอก Manage Sites ใหคลกทปม New ดงรป

PERSON

images photos


รปท 4 แสดงไดอะลอก Manage Sites

4. ปรากฎไดอะลอก ดงรป คลกท Site เพอก าหนดชอ Site และโฟลเดอรของงาน ตวอยางนก าหนดชอไซต (Site Name) เปน PERSON และโฟลเดอรทเกบโปรแกรม C:\AppServ\www\PERSON ดงตอไปน

Site name: PERSON (ชอเวบแอพพลเคชนทเราก าหนดเอง)

ชอโฟลเดอรหลก (ชอไซต)

ทอยของไซตหลก


Local root folder: C:\AppServ\www\person\ (การก าหนดไดเรคทอรทใชบนทกซอรสโคดทเราพฒนาขนบนเครองเราเอง (local) ) 5. คลกทเมน Advanced Setting จะปรากฏดงรป

ในทนเลอก Local Info เพอก าหนดโฟลเดอรของรปภาพ และ URL

Default Images folder: ต าแหนงของไฟลรปภาพ Web URL: http://localhost/PERSON/ (URL ส าหรบใชงานเวบแอพพลเคชนทเราพฒนาบนเครองเราเอง (local) )


6. คลกทเมน Server เพอก าหนดเซรฟเวอร

คลกทเครองหมาย เพอเพมเซรฟเวอร จะปรากฏดงรป

Server Name : localhost (การก าหนดวธการตดตอกบเวบเซรฟเวอรทใชทดสอบเวบเพจ เลอกก าหนดเปนคา None FTP หรอ Local/Network)


- คลกทแทบ Advanced เพอก าหนด Server Model

Server Model: PHP MySQL (การก าหนดให Dreamweaver รวาเราจะใชภาษาคอมพวเตอรใด ในการพฒนา เวบแอพพลเคชนนน เชน PHP MySQL หรอ ASP VBSCRIPT) จากนนกดปม Save และกลบมาทหนาตาง Server


จากนนกดปม Save อกครง จะกลบมายงหนา Manage Site ดงรป ซงจะมไซตทเราสรางขนปรากฏอย ใหคลกปม Done เปนอนเสรจสนในการก าหนดไซต และสงเกตท Site Panel จะปรากฏชอไซต PERSON จากนนคลกปม DONE ทพรอมจะใชงาน

7. Dreamweaver กพรอมส าหรบการเรมตนใชงาน เพอพฒนาเวบแอพพลเคชน PERSON ในการเรยกใชงานครงตอไป Dreamweaver จะเปดมาทเวบไซตทมการเปดใชงานลาสดเสมอ


บทท 8 การสรางระบบแสดงผลขอมล

ในเนอหาทผานมา เราไดผานขนตอนการก าหนดไซตส าหรบการพฒนาเวบแอพพลเคชน PHP_MySQL และการก าหนดการตดตอกบฐานขอมลมาแลว เนอหาในบทนจะกลาวถงการสรางเวบเพจทสามารถเรยกใชขอมลจากตารางในฐานขอมลมาแสดงผลบนเวบเพจ ระบบแสดงผลขอมล คอเวบเพจทท าหนาทในการเรยกขอมลจากตาราง (Table) ในฐานขอมล น ามาแสดงผลบนหนาเวบเพจ

รปแสดงไฟลทเกยวของกบระบบแสดงผลขอมล

ระบบแสดงผลขอมลในสวนทจะอธบายน จะประกอบดวยไฟล 2 ไฟล list.php ท าหนาทแสดงขอมลพนกงานหนาละหลายเรคอรด มลงคส าหรบคลกสง URL Parameter ไปยงไฟล detail.php เพอดรายละเอยดพนกงานแตละคน detail.php ท าหนาแสดงรายละเอยดของพนกงานแตละคน โดยรบคา URL Parameter จากไฟล list.php การสรางระบบแสดงขอมลทยกมาอธบายในทน แบงเปนขนตอนไดดงตอไปน 1. การสรางตารางส าหรบแสดงผลขอมล 2. การแทรก Recordset (Query) เพอเรยกใชตารางและฟลดในฐานขอมล 3. น าฟลดแตละฟลดมาวางลงในตาราง 4. การแสดงผลมากกวา 1 เรคอรด โดยใช Repeat Region 5. การแบงหนาแสดงผล


6. การคนหาขอมลทตองการแสดงรายละเอยดทละ 1 เรคอรด 7. การใชงานระบบแสดงผลขอมล (1) การสรางตารางส าหรบแสดงผลขอมล ขนตอนน จะเปนการสรางตารางส าหรบแสดงผลขอมล โดยจะเปนการแสดงขอมลทละหลายๆ เรคอรดลงในเวบเพจ พรอมทงมการปรบแตงรปแบบโดยใชเครองมอของ Dreamweaver ขนตอน: 1. เรมตนทโปรแกรม Dreamweaver คลกเมน File > New จะปรากฏไดอะลอก New Document ขนมา ใหคลก PHP หลงจากนนคลกปม Create บนทกเปนไฟล list.php 2. เลอกเมน Modify > Page Properties… เมอปรากฏไดอะลอก Page Properties ขนมา ใหก าหนด Properties ของเวบเพจ ดงรายละเอยดดานลางน หลงจากนนคลกปม OK

คาของไดอะลอก คาทก าหนด Title List Employees Background Image images/bkg_list.gif Encoding Thai (Windows)

ตารางแสดงการก าหนดคาในไดอะลอก Page Properties

3. ปรบแตงตารางโดยการแทรกไฟลรปภาพ และขอความลงในตารางและสวนตางๆ ของเวบเพจ เมอเสรจแลวจะไดเวบเพจ ดงรปดานลาง

รปแสดงหนาเวบเพจ list.php


(2) การแทรก Recordset (Query) เพอเรยกใชตารางและฟลดในฐานขอมล

การแทรก Recordset (Query) คอ ขนตอนการแทรกสครปต PHP ส าหรบการสรางเรคอรดเซต เพอน าขอมลจากเรคอรดเซต มาแสดงบนเวบเพจ ซงจะกลาวถงในขนตอนตอไป

ขนตอน: 1. คลกทแถบ Bindings หลงจากนนใหคลกเครองหมาย บวกเลอกเมน Recordset (Query) 2. เมอปรากฏไดอะลอก Recordset ขนมา ใหก าหนดคาตางๆ ดงรายละเอยดขางลางน หลงจากนนใหบนทกไฟล list.php

รปแสดงการเลอกเมน

Recordset (Query)


รปแสดงการก าหนดคาไดอะลอก Recordset

(3) น าฟลดแตละฟลดมาวางลงในตาราง การน าฟลดแตละฟลดมาวางลงในตารางของไฟล list.php ทออกแบบไวแลว มาแสดงผลขอมลในเวบเพจ ขนตอน: 1. คลกไปทแถบ Bindings หลงจากนนใหคลกเครองหมายบวก หนารายการ Recordset (rsEmp) จะปรากฏชอฟลดของตาราง employee ในฐานขอมล ใหคลกเลอกและแทรกฟลดลงเวบเพจ เพอแสดงผลขอมล ตามขนตอน ดงรปดานลาง

ตงชอ record set คอ rsEmp

เลอกการเชอมตอทสรางไว

คอdbconn

เลอกตารางทใช คอ

employee

การเรยงขอมลตาม name

จากนอยไปมาก


คอลมนของตาราง ฟลดของ Recordset (rsEmp)

ชอ-นามสกล name, lastname

แผนก dept_id

เงนเดอน Salary

ตารางแสดงการเลอกฟลดจากเรคอรดเซตวางลงในเวบเพจ

(1) คลกเมาสต าแหนงของขอมลทตองการแสดง

รปแสดงการเลอกฟลดจากเรคอรดเซตวางลงในเวบเพจ

(2) คลกเลอกฟลดทตองการ

(3) คลกปม Insert


สวนขอมลอน ๆ ท าเชนเดยวกน

2. บนทกไฟล list.php 3. สามารถทดสอบดผลการท างานได โดยกดปม F12 จากหนาจอ Dreamweaver โดยจะแสดงขอมลเพยง 1 เรคอรดเทานน (4) การแสดงผลมากกวา 1 เรคอรด โดยใช Repeat Region ในขนตอนทแลว หากลองทดสอบการท างานของเวบเพจ จะเปนวามการแสดงผลขอมลออกมาจ านวน 1 เรคอรด ซงทจรงแลว ขอมลอาจจะมมากกวา 1 เรคอรดกได ดงนนในขนตอนน จะเปนการก าหนดใหเวบเพจแสดงผลวนซ าจนกวาจะครบทกเรคอรด ขนตอน: 1. เรมตนทหนาจอ Dreamweaver เปดไฟล list.php ใหคลกเลอกบรเวณทตองการแสดงผลขอมลวนซ า คอบรรทดท 2 ของตาราง เพอใหต าแหนงของเคอรเซอรอยภายในบรเวณบรรทดทแสดงผล หลงจากนนใหคลกเลอกแทก <TR> บน Tag Selector


รปการก าหนดการวนลปแสดงผลซ า

2. จากนนคลกแถบ Server Behaviors หลงจากนนใหคลกเครองหมายบวก

เพอเลอกเมน Repeat Region เมอปรากฏไดอะลอก Repeat Region ใหก าหนดคาตางๆ

ดงรายละเอยดขางลางน หลงจากนนใหคลกปม OK

รปการก าหนดแสดงผลทกเรคอรด 3. บนทกไฟล list.php

(1) คลกเมาสต าแหนงใด ๆ ในตาราง

(2) คลกเลอกแทก <tr> ท Tag Selector

รปแสดงการก าหนด Repeat Region

เลอก record set คอ rsEmp

เลอกจ านวนเรคอรดทแสดงตอ 1 หนา

ในทนเลอก All records


4. ทดสอบการท างานของไฟล list.php โดยการกด F12 จะเหนวาหากขอมลมจ านวน เรคอรดมาก จะตองเลอนสไลดขนไปด

ผลลพธทได

เขยนโปรแกรมส าหรบแสดงขอมล

1 2 3 4 5 6 7 8 9

<table border=1> <tr> <td> <center> ชอ-นามสกล </center></td> <td><center> แผนก </center></td> <td> <center> เงนเดอน </center></td> <td><center> แกไข ลบ </center></td> </tr> <? $hotname = ‚localhost‛; //database server


10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 27 28 29 30 31 32 33 34 35

$user = ‚root‛; //ชอผใช $password = ‚root‛; //รหสผาน $dbname = ‚human‛; //ชอฐานขอมล $tbname = ‚employee‛; //ชอตาราง //เชอมตอฐานขอมล mysql_connect($hostname, $user, $password) or die("ตดตอฐานขอมลไมได"); //ตดตอฐานขอมล mysql_select_db($dbname) or die("ตดตอฐานขอมลไมได"); //ค าสง SQL $query_rsEmp = "SELECT * FROM employee ORDER BY name ASC"; $rsEmp = mysql_query($query_rsEmp); //ประมวลผลค าสง $totalRows_rsEmp = mysql_num_rows($rsEmp);//นบจ านวนเรคอรด/แถวในตาราง ?> <? if ($totalRows_rsEmp > 0) { // Show if recordset not empty ?> //ถามเรคอรด <? do { ?> <tr> <td><? echo $row_rsEmp['name']; ?> <?php echo $row_rsEmp['lastname']; ?></td> //แสดงคาในฟลด name และ lastname <td><? echo $row_rsEmp['dept_id']; ?></td> //แสดงรหสแผนก <td><? echo $row_rsEmp['salary']; ?></td> //แสดงเงนเดอน <td align="center" nowrap>แกไข ลบ</td> //แสดงขอความกไข ลบ </tr> <? } while ($row_rsEmp = mysql_fetch_assoc($rsEmp)); ?>


<? } // Show if recordset not empty ?> <? mysql_close(); //ปดฐานขอมล ?>

(5) การแสดงผลขอมลแบบแบงหนา จากการแสดงผลในขนตอนทผานมา ถามเรคอรดจ านวนมาก กจะแสดงจนหมด ดงนนหากตองการดขอมลเรคอรดแรก ๆ ไมสามารถหยดดได จงตองมการแบงหนาเพอแสดงผลทละหนา ไม มขนตอนใหญ ๆ ดงน 1. การก าหนดจ านวนเรคอรดส าหรบแสดงผลตอ 1 หนา 2. การสรางลงคส าหรบคลกแสดงผลทละ 1 หนา 3. การใชงานระบบแสดงผลขอมลแบบแบงหนา 5.1 การก าหนดจ านวนเรคอรดแสดงผลตอ 1 หนา ในขนตอนน จะเปนการก าหนดใหเวบเพจแสดงผลวนซ าจนกวาจะครบจ านวนเรคอรดตอ 1 หนาทระบ


ขนตอนการก าหนดจ านวนเรคอรดแสดงผลตอ 1 หนา: 1. เปดไฟล list.php คลกเลอกบรเวณทตองการแสดงผลขอมลวนซ า คอบรรทดท 2 ของตาราง เพอใหต าแหนงของเคอรเซอรอยภายในบรเวณบรรทดทแสดงผล หลงจากนนใหคลกเลอกแทก <TR> บน Tag Selector

รปแสดงการก าหนดการแสดงจ านวนเรคอรดตอหนา

2. คลกทแถบ Server Behaviors หลงจากนนใหดบเบลคลกรายการ Repeat Region ทไดสรางไวกอนหนาน ดงรป

รปแสดงไดอะลอก Repeat Region แสดงการก าหนด

แสดงผล 10 เรคอรดตอ 1 หนา

(1) คลกเมาสต าแหนงใด ๆ ในตาราง

(2) คลกเลอกแทก <tr> ท Tag Selector

เลอก record set คอ rsEmp

ก าหนดจ านวนเรคอดรตอหนา


3. บนทกไฟล list.php และทดสอบโปรแกรมโดยการกด F12 พบวาแสดงเฉพาะ 10 เรคอรดแรกเทานน เรคอรดถดไปจะไมแสดงผล

5.2 การนบจ านวนเรคอรด และการแบงหนาแสดงผล ในขนตอนการก าหนดจ านวนเรคอรดแสดงผลตอ 1 หนา ทผานมา จะเหนวาเราไดก าหนดใหแสดงผลขอมลครงละ 10 เรคอรด ดงนน หากลองทดสอบการท างานไฟล list.php จะพบวามขอมลทแสดงผลเพยง 10 เรคอรดเทานน ซงในความเปนจรงอาจจะมมากกวานนกได ในสวนนกจะเปนการสรางลงคส าหรบคลกกลบไป-มาทละ 10 เรคอรด หรอแลวแตจ านวนทเราก าหนดในขนตอนการแสดงผลซ านนเอง ขนตอน: 1. เปดไฟล list.php 2. คลกเมาสเพอวางเคอรเซอรทต าแหนงดานลางถดจากตารางแสดงผล


3. หลงจากนนใหคลกเลอกเมน Insert > Data Objects > Display Record Count > Recordset Navigation Status เมอปรากฏไดอะลอก Recordset Navigation Status ขนมา เปนการใหเลอกวาจะกระท ากบ Recordset ใด (กรณทใน 1 เวบเพจมการสรางหลาย Recordset) ในทนใหเลอก rsEmp หลงจากนนใหคลก OK

รปแสดงไดอะลอก Recordset Navigation Status

จะปรากฏขอความแสดงสถานะวาขณะนก าลงแสดงผลเรคอรดใดบาง

รปแสดง Recordset Navigation Status

คลกเลอกวางต าแหนง

เลอก record set คอ reEmp


4. คลกเลอกเมน Insert > Data Objects > Recordset Paging > Recordset Navigation Bar 5. เมอปรากฏไดอะลอก Recordset Navigation Bar ขนมา เปนการใหเลอกวาจะกระท ากบ Recordset ใด (กรณทใน 1 เวบเพจมการสรางหลาย Recordset) ในทนใหเลอก rsEmp ในชอง Display Using ใหเลอก Text หลงจากนนใหคลก OK

รปแสดงไดอะลอก Recordset Navigation Bar

จะปรากฏลงคส าหรบคลกเพอแสดงผลขอมลกลบไป-มาทละ 10 เรคอรด หรอแลวแตจ านวนทเราก าหนดในขนตอนการแสดงผลซ า

รปแสดง Recordset Navigation Bar

6. บนทกไฟล list.php

5.3 การใชงานระบบแสดงผลขอมลแบบแบงหนา

เรมตนโดยใชโปรแกรม Dreamweaver เปดไฟล list.php ขนมา แลวกดปม F12

โปรแกรม Internet Explorer จะถกเปดขนมาเรยกใชงานไฟล list.php หลงจากนนทดสอบ

คลกทลงค First Previous Next และ Last ดานลางของหนาเวบเพจ เรคอรดทแสดงผลจะ

ปรากฏขนมาทละ 10 เรคอรด


1 2 3 4 5 6 7 8 9 10 11 12

<table border=1> <tr> <td> <center> ชอ-นามสกล </center></td> <td><center> แผนก </center></td> <td> <center> เงนเดอน </center></td> <td><center> แกไข ลบ </center></td> </tr> <? mysql_connect("localhost","root","root"); mysql_select_db("Human"); $query_rsEmp = "SELECT * FROM employee ORDER BY name ASC"; $rsEmp = mysql_query($query_rsEmp);


13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36

$totalRows_rsEmp = mysql_num_rows($rsEmp); ?> <? if ($totalRows_rsEmp > 0) { // Show if recordset not empty ?> <? do { ?> <tr> <td><a href="detail.php?emp_id=<?php echo $row_rsEmp['emp_id']; ?>"><? echo $row_rsEmp['name']; ?> <?php echo $row_rsEmp['lastname']; ?></td> <td><? echo $row_rsEmp['dept_id']; ?></td> <td><? echo $row_rsEmp['salary']; ?></td> <td align="center" nowrap>แกไข ลบ</td> </tr> <? } while ($row_rsEmp = mysql_fetch_assoc($rsEmp)); ?> <? } // Show if recordset not empty ?> <p> เรคอรดท <?php echo ($startRow_rsEmp + 1) ?> ถง <?php echo min($startRow_rsEmp + $maxRows_rsEmp, $totalRows_rsEmp) ?> จากทงหมด <?php echo $totalRows_rsEmp ?> เรคอรด</p> </p> <table border="0"> <tr> <td width="136"><?php if ($pageNum_rsEmp > 0) { // Show if not first page ?> <div align="right"><a href="<?php printf("%s?pageNum_rsEmp=%d%s", $currentPage, 0, $queryString_rsEmp); ?>">หนาแรก</a> </div> <?php } // Show if not first page ?></td>


37 38 39 40 41 42 43 44 45 46 47 48 49

<td width="58"><?php if ($pageNum_rsEmp > 0) { // Show if not first page ?> <a href="<?php printf("%s?pageNum_rsEmp=%d%s", $currentPage, max(0, $pageNum_rsEmp - 1), $queryString_rsEmp); ?>">กอนหนาน</a> <?php } // Show if not first page ?></td> <td width="57"><?php if ($pageNum_rsEmp < $totalPages_rsEmp) { // Show if not last page ?> <a href="<?php printf("%s?pageNum_rsEmp=%d%s", $currentPage, min($totalPages_rsEmp, $pageNum_rsEmp + 1), $queryString_rsEmp); ?>">หนาถดไป</a> <?php } // Show if not last page ?></td> <td width="50"><?php if ($pageNum_rsEmp < $totalPages_rsEmp) { // Show if not last page ?> <a href="<?php printf("%s?pageNum_rsEmp=%d%s", $currentPage, $totalPages_rsEmp, $queryString_rsEmp); ?>">หนาสดทาย</a> <? } // Show if not last page ?></td> </tr> </table> <? mysql_close(); ?>

(6) การคนหาขอมลทตองการแสดงรายละเอยดทละ 1 เรคอรด การแทรกสครปตคนหาขอมลน จะเปนการแทรกลงในไฟล detail.php เพอน าเอาขอมลพนกงานออกมาแสดงรายละเอยดในเวบเพจทละเรคอรด โดยเงอนไขการคนหาขอมลนน จะใชฟลด emp_id ของตารางในฐานขอมล เปรยบเทยบกบคา URL Parameter "emp_id" ทถกสงมาจากไฟล list.php


แบงออกเปน 2 ขนตอนคอ 1. การแทรกสครปตส าหรบแสดงผลขอมลทละ 1 เรคอรดลงในเวบเพจ 2. การสงและรบคา URL Parameter เพอระบเรคอรดทตองการแสดงผล 6.1 การแทรกสครปตส าหรบแสดงผลขอมลทละ 1 เรคอรดลงในเวบเพจ ขนตอน: 1. เรมตนทโปรแกรม Dreamweaver คลกเมน File > New จะปรากฏไดอะลอก New Document ขนมา ใหคลก PHP หลงจากนนคลกปม Create บนทกเปนไฟล detail.php 2. แทรกตาราง HTML ส าหรบแสดงขอมลลงในเวบเพจ โดยใหมหนาเวบเพจ ดงรป

รปแสดงแบบตารางส าหรบแสดงผลขอมล

TextField ชอ emp_id

TextField ชอ name

TextField ชอ lastname

TextField ชอdate_born

TextField ชอ gender

TextField ชอ salary

TextField ชอ dept_id

Text Area ชอ Address

Image ชอ photo


3. เลอกเมน Modify > Page Properties เมอปรากฏไดอะลอก Page Properties ขนมา ใหก าหนด Properties ของเวบเพจ ดงรายละเอยดดานลางน หลงจากนนคลกปม OK

คาของไดอะลอก คาทก าหนด Title Employee Details Background Images images/bkg_detail.gif Document Encoding Thai Windows

4. คลกแถบ Bindings หลงจากนนใหคลกปมเครองหมายบวก และเลอกรายการ Recordset (Query) เมอปรากฏไดอะลอก Recordset ขนมา ใหก าหนดคาตางๆ ดงรายละเอยดขางลางน หลงจากนนใหคลกปม OK

รปแสดงไดอะลอก Recordset 5. ไฟล detail.php คลกทแถบ Bindings หลงจากนนใหคลกเครองหมายบวก หนารายการ Recordset (rsEmp) จะปรากฏชอฟลด ใหคลกเลอกและแทรกฟลดลงเวบเพจ เพอแสดงผลขอมล

ชอ record set

ชอ connection

ชอ ตาราง

ฟลดกรองขอมล

URL ทสงมาเพอ

เปรยบเทยบกบ

Filter


6. ส าหรบฟลด photo ซงเกบชอไฟลรปภาพพนกงาน เชน Amit_Kelly.jpg เราตองการใหแสดงในลกษณะรปภาพ โดยใหเอาไฟลรปภาพ photos\Amit_Kelly.jpg มาแสดงบนเวบเพจ ใหคลกทเมน Insert > Image จะปรากฏไดอะลอก Select Image Source ใหก าหนดคาตางๆ ดงตารางดานลาง หลงจากนนใหคลกปม OK


7. บนทกไฟล detail.php

6.2 การสงและรบคา URL Parameter เพอระบเรคอรดทตองการแสดงผล

ขนตอนน กคอการท าใหไฟลเวบเพจ 2 ไฟล list.php และ detail.php สามารถเชอมโยงเพอสงและรบคา URL Parameter กนไดนนเอง ขนตอนการสงและรบคา URL Parameter เพอระบเรคอรดทตองการแสดงผล 1. เรมตนทโปรแกรม Dreamweaver เปดไฟล list.php ขนมา แลวลากเมาสท า ไฮไลตต าแหนงแสดงผลฟลด name และ lastname ดงรป


รปแสดงการลากเมาสท าไฮไลตฟลด name และ lastname

2. คลกทแถบ Server Behavior และคลกเครองหมายบวก จากนนเลอกรายการ Go To Detail Page for PHP จะปรากฏหนาตาง Go To Detail Page for PHP ดงรป และก าหนดคาตาง ๆ

6. บนทกไฟล list.php กเปนเสรจขนตอนการก าหนดการสงคา URL Parameter 7. ขนตอนสดทายคอก าหนดใหไฟล detail.php รบคา URL Parameter ทสงมาจากไฟล list.php ซงวธการท านน เราไดท าผานมาแลวใหยอนกลบไปดในขนตอน "การคนหาขอมลทตองการแสดงรายละเอยดทละ 1 เรคอรด" จะเหนไดวา เราไดมการเรยกใช URL Parameter ‚emp_id‛ ซงกคอคา URL Parameter ทสงไปจากไฟล list.php นนเอง (7) การใชงานระบบแสดงผลขอมล เรมตนโดยใชโปรแกรม Dreamweaver เปดไฟล list.php ขนมา แลวกดปม F12 โปรแกรม Internet Explorer จะถกเปดขนมาเรยกใชงานไฟล list.php ใหทดสอบคลกท

เลอกไฟลทตองการสงคา URL

ชอ recordset

คา URL ทสงไปไฟล


ขอมล ชอ-นามสกลของพนกงานแตละคน จะปรากฏหนาเวบเพจแสดงรายละเอยดประวตขอมลพนกงานทละคน

เรมจากการเรยกใชโปรแกรม list.php

หลงจากนนคลกทชอ จะเรยกโปรแกรม detail.php ขนมาแสดง


การเขยนโปรแกรม

1. ท าการปรบปรงโปรแกรม list.php โดยเพมค าสงในบรรทดท 18 เพอเชอมโยงไปยงไฟล detail.php โดยสงคา URL คอ emp_id

1 2 3 4 5 6 7 8 9 10 11

<table border=1> <tr> <td> <center> ชอ-นามสกล </center></td> <td><center> แผนก </center></td> <td> <center> เงนเดอน </center></td> <td><center> แกไข ลบ </center></td> </tr> <? mysql_connect("localhost","root","root"); mysql_select_db("Human"); $query_rsEmp = "SELECT * FROM employee ORDER BY name


12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

ASC"; $rsEmp = mysql_query($query_rsEmp); $totalRows_rsEmp = mysql_num_rows($rsEmp); ?> <? if ($totalRows_rsEmp > 0) { // Show if recordset not empty ?> <? do { ?> <tr> <td><ahref="detail.php?emp_id=<?php echo $row_rsEmp['emp_id']; ?>"><? echo $row_rsEmp['name']; ?> <?php echo $row_rsEmp['lastname']; ?></td> <td><? echo $row_rsEmp['dept_id']; ?></td> <td><? echo $row_rsEmp['salary']; ?></td> <td align="center" nowrap>แกไข ลบ</td> </tr> <? } while ($row_rsEmp = mysql_fetch_assoc($rsEmp)); ?> <?php } // Show if recordset not empty ?> <? mysql_close(); ?>

ผลการเรยกใชโปรแกรม list.php


โปรแกรม detail.php

1 2 3 4 5 6 7 8 9 10 11 12 13

14 16 17

<table width="480" border="1" cellpadding="3" cellspacing="1" > <tr> <td width="33%" rowspan="8" align="center" <table width="100%" border="0" cellpadding="2" cellspacing="1"> <tr> <td >รปภาพ:</td> </tr> <tr> <td align="center"><img src="photos/<?php echo $row_rsEmp['photo']; ?>"></td> </tr> </table></td> <td width="21%" align="right" nowrap bgcolor="#FFE5B2" class="detaillabels">รหสพนกงาน:</td> <td width="46%" <label for="textfield"><? echo $row_rsEmp['emp_id']; ?></label></td> </tr> <tr> <td align="right" >ชอ:</td>


18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34

35 36 37 38 39 40 41 42 43 44

<td><? echo $row_rsEmp['name']; ?></td> </tr> <tr> <td align="right" >นามสกล:</td> <td><? echo $row_rsEmp['lastname']; ?></td> </tr> <tr> <td align="right">เพศ:</td> <td><? echo $row_rsEmp['gender']; ?></td> </tr> <tr> <td align="right">วนเกด:</td> <td><? echo $row_rsEmp['date_born']; ?></td> </tr> <tr> <td align="right">แผนก:</td> <td><label for="select"><? echo $row_rsEmp['dept_id']; ?></label></td> </tr> <tr> <td align="right">เงนเดอน:</td> <td><? echo $row_rsEmp['salary']; ?></td> </tr> <tr> <td align="right">ทอย:</td> <td><?php echo $row_rsEmp['address']; ?></td> </tr> </table>


บทท 9 การสรางระบบคนหาขอมล

ระบบคนหาขอมล คอเวบเพจทท าหนาทในการเรยกคนหาขอมลจากฐานขอมล และน าผลลพธมาแสดงผลทหนาจอเวบเพจ

รปแสดงไฟลทเกยวของกบระบบคนหาขอมล

ระบบคนหาขอมลในสวนทจะอธบายน จะประกอบดวยไฟล 2 ไฟล

1. searchadv.php ท าหนาทรบคาค าคน แลวสงไปเปน URL Parameter ชอ keywords ไปใหไฟล resultadv.php ใชเปรยบเทยบคนหาขอมลจากตารางในฐานขอมล 2. resultadv.php ท าหนาแสดงรายละเอยดของพนกงานทละคน โดยจะรบ URL Parameterชอ keywords ในรปแบบ $_GET[‘keywords’] จากฟอรมในไฟล searchadv.php ขนตอนการสรางระบบคนหาขอมลทยกมาอธบายในทน แบงเปนขนตอนดงตอไปน 1. การสรางฟอรมส าหรบพมพค าคน และก าหนด properties 2. การคนหาขอมลแบบเงอนไขเดยว (Basic) 3. การใชงานระบบคนหาขอมลแบบเงอนไขเดยว (Basic) 4. การคนหาขอมลแบบหลายเงอนไข (Advanced) 5. การใชงานระบบคนหาขอมลแบบหลายเงอนไข (Advanced) (1) การสรางฟอรมส าหรบพมพค าคน ขนตอนนจะเปนการสรางฟอรมส าหรบพมพค าคน โดยการแทรกฟอรมและออบเจคตของฟอรมชนด Text Field ส าหรบรบคาค าคน


ขนตอนการสรางฟอรมส าหรบพมพค าคน: 1. เรมตนทโปรแกรม Dreamweaver คลกเมน File > New จะปรากฏไดอะลอก New Document ขนมา ใหคลก PHP หลงจากนนคลกปม Create เมอปรากฏเวบเพจวางๆ ขนมา ใหบนทกเปนไฟล searchadv.php 2. เลอกเมน Modify > Page Properties เมอปรากฏไดอะลอก Page Properties ขนมา ใหก าหนด Properties ของเวบเพจ ดงรายละเอยดดานลางน หลงจากนนคลกปม OK

คาของไดอะลอก คาทก าหนด Title List Search employees Background Image images/bkg_list.gif Encoding Thai (Windows)

3. แทรกฟอรมลงในเวบเพจ โดยคลกไปทเมน Insert > Form และก าหนดชอฟอรมเปน fmSearch สวน Action ก าหนดเปน resultadv.php และ Method ก าหนดเปน Get

รปแสดงการก าหนด Property ของฟอรม


4. แทรกฟอรมส าหรบคนหาขอมล ดงรป

รปแสดงการก าหนดรายละเอยดตาง ๆ ในฟอรม 5. บนทกไฟล searchadv.php

(2) การคนหาขอมลแบบเงอนไขเดยว (Basic) ขนตอนน จะเปนการ Recordset (Query) ส าหรบคนหาขอมลจากฐานขอมล โดย

จะมการก าหนดเงอนไขในการคนหาขอมลจาก URL Parameter ชอ $_GET[‘keywords’] ทสงมาจากไฟล searchadv.php การแทรก Recordset (Query) น จะคลายกบขนตอนการสรางในไฟล list.php เพอเปนการประหยดเวลา จงแนะน าใหเปดไฟล list.php ขนมาแลวบนทกเปนไฟล resultadv.php ขนตอนการคนหาขอมลแบบเงอนไขเดยว (Basic): 1. เปดไฟล list.php ของระบบแสดงผลขอมลขนมา ใหบนทก (SAVE AS…) เปนไฟล resultadv.php 2. คลกทแถบ Bindings ดบเบลคลกทรายการ Recordset (rsEmp) เมอปรากฏไดอะลอก Recordset ขนมา ใหก าหนดคาของตวแปรตางๆ ดงรายละเอยดตอไปน

TextField ชอ keywords

Button ก าหนด Action เปน Submit Button ก าหนด Action เปน Reset Form


คาของไดอะลอก คาทก าหนด Name rsEmp

Connection dbconn Table employee

Columns Filter ชองท 1: name หมายถงใหคนหาจากฟลด name

ชองท 2: contains หมายถงใหคนหาแบบประกอบดวย (LIKE) ชองท 3: URL Parameter หมายถง รบคาค าคนจาก URL Parameter (สงมาจากฟอรมท METHOD="GET") ชองท 4: keywords หมายถง ค าคนถกสงมาเปน URL Parameter ชอ keywords name , Ascending หมายถง เรยงล าดบตาม name นอยไปหามาก

Sort name , Ascending หมายถง เรยงล าดบตาม name นอยไปหามาก


3. บนทกไฟล resultadv.php

(3) การใชงานระบบคนหาขอมลแบบเงอนไขเดยว (Basic) เรมตนโดยใชโปรแกรม Dreamweaver เปดไฟล searchadv.php ขนมา แลวกดปม F12 โปรแกรม Internet Explorer จะถกเปดขนมาเรยกใชงานไฟล searchadv.php หลงจากนนใหพมพค าคน และคลกปม Search เพอคนหาขอมลจากฟลด name การท างานของโปรแกรม searchadv.php ใหปอนค าคน โดยปอนชอพนกงาน จากนนท าการกดปม Search เพอท าการคนหา โดยจะเรยกโปรแกรม resultadv.php

ชอ record set คอ rsEmp

เลอก connection

คอ dbconn

เลอก ตาราง คอ

employee

กรองตามชอในตาราง โดยอยสวนใดกไดในชอ

ตวแปร keywords ทสงมาจาก searchadv.php

เรยงล าดบตามชอ


หนาจอการท างานโปรแกรม searchadv.php

หนาจอโปรแกรม resultadv.php

โปรแกรมคนหาขอมล searchadv.php

1 2 3 4

form action="resultsadv.php" method="get" name="fmSearch" id="fmSearch"> <table width="71%" border="1" cellspacing="1" cellpadding="3"> <tr> <td width="42%"><div align="center">


5 6 7 8 9 10 11

ค าคน : </div></td> <td width="26%"><input name="keywords" type="text" id="keywords" size="25" maxlength="25"></td> <td width="32%"><input type="submit" name="btnSubmit" id="btnSubmit" value="Search"></td> </tr> </table> </form>

(4) การคนหาขอมลแบบหลายเงอนไข (Advanced) ในขนตอนทผานมา เราไดคนหาขอมลโดยในการ Filter ขอมลนนจะเปนการเปรยบเทยบคาฟลด name กบ URL Parameter $_GET[‘keywords’] ซงกหมายถง คนหาขอมลจากฟลด name ฟลดเดยวเทานน การคนหาดวยเงอนไขทซบซอนมากกวาน สามารถท าไดโดยการดบเบลคลก Recordset(rsEmp) ขนมา แลวคลกปม Advanced… เพอเขาไปเพมเตมเงอนไขการคนหาขอมล ขนตอนการคนหาขอมลแบบหลายเงอนไข (Advanced): 1. เปดไฟล resultadv.php 2. คลกทแถบ Bindings จากนนดบเบลคลกทรายการ Recordset (rsEmp) เมอปรากฏไดอะลอก Recordset ขนมา ใหคลกปม Advanced… เพอก าหนดแกไขค าสง SQL ส าหรบคนหาหลายเงอนไข


หลงจากทกดปม Advanced จะปรากฏหนาตาง Recordset

รปแสดงไดอะลอก Recordset ในโหมด Advanced

ดบเบลคลก คลกปม

Advanced


คาของไดอะลอก คาทก าหนด Name rsEmp

Connection dbconn SQL SELECT * FROM employee

WHERE name LIKE%colname ORDER BY name ASC

ความหมายค าสงในชอง SQL SELECT * FROM employee //เลอกทกฟลดในตาราง employee WHERE name LIKE%colname% //เงอนไขคอค าคนทสงมาใหไปหาในฟลดชอ name โดยค าคนดงกลาวจะอยในสวนของชอตรงไหนกได ORDER BY name ASC //เมอคนไดแลวใหแสดงขอมล โดยเรยงตามชอ 3. หากตองการคนหาขอมล นอกจากในชอแลว ยงสามารถคนหาในนามสกล หรอรหสแผนก เปนตน ดงนนตองปรบค าสงในไดอะลอก Recordset ดงรปค าสงดานลาง หลงจากนนใหทดสอบการคนหาโดยเปด Dreamweaver ไปทไฟล searchadv.php แลวกด F12 SELECT employee.* FROM employee WHERE employee.dept_id = colname OR ( employee.name LIKE %colname% OR employee.lastname LIKE %colname% ) ORDER BY name ASC 5. ท าการบนทก และทดสอบโปรแกรม 6. จากตวอยางจะเหนวารหสแผนกจะแสดงเปนตวเลข ซงไมสอความหมาย ดงนนจะตองน ารหสแผนกไปอานในตาราง department เพอน าชอแผนก (deptname) มาแสดงแทนรหสแผนก ดงนนปรบค าสงในไดอะลอก Recordset ดงรปค าสงดานลาง เพอ JOIN ตาราง department เอาฟลดชอแผนก (deptname) มาแสดงผลและเพมเงอนไข ใหคนหา


จากฟลด name และ lastname หลงจากนนใหทดสอบการคนหาโดยเปด Dreamweaver ไปทไฟล searchadv.php แลวกด F12 SELECT employee.*, department.deptname FROM employee, department WHERE employee.dept_id = department.dept_id AND ( employee.name LIKE '%colname%' OR employee.lastname LIKE '%colname%' ) ORDER BY name ASC

และท าการแกไข Record set ดงน 6.1 เปดไฟล resultadv.php จากนนเลอก BINDINGS และดบเบลคลกท rsEmp ซงจะเหนวามการ JOIN ตาราง นนคอจะมฟลด deptname ของตาราง department มารวมอย


6.2 จากนนคลกทชองแสดงแผนก และใชเมาสคลกทฟลด deptname ใน reEmp และกดปม insert หรอลากไปวางในชองดงกลาว

6.3 ใหท าการบนทก resultadv.php 6.4 ทดสอบโปรแกรม โดยเปดไฟล searchadv.php


หนาจอแสดงผลการคนหา

ซงจะเหนวาจะแตกตางจากโปรแกรม list.php คอ ชองแสดงแผนก จะแสดงชอแผนก ไมใชแสดงรหสแผนกเหมอนโปรแกรม list.php (5) การใชงานระบบคนหาขอมลแบบหลายเงอนไข (Advanced) เรมตนโดยใชโปรแกรม Dreamweaver เปดไฟล searchadv.php ขนมา แลวกดปม F12 โปรแกรม Internet Explorer จะถกเปดขนมาเรยกใชงานไฟล searchadv.php หลงจากนนใหพมพค าคน และคลกปม Search เพอคนหาขอมล โดยใหทดสอบพมพค าคนทตรงกบคาในฟลด emp_id name lastname และ dept_id ทละเงอนไขแลวสงเกตผลลพธวาถกตองหรอไม


บทท 10 การสรางระบบเพมขอมล

ระบบเพมขอมล คอเวบเพจทท าหนาทในการรบขอมลจากผใชผานฟอรม และบนทกการกรอกขอมลเขาจดเกบในฐานขอมล ในทนจะประกอบดวยไฟล 2 ไฟล ดงรป

รปแสดงไฟลทเกยวของกบระบบเพมขอมล

? insert.php ประกอบดวยฟอรมส าหรบเปนแบบฟอรมกรอกขอมลและสครปตส าหรบจดเกบขอมลลงตารางของฐานขอมล ? insertok.php ประกอบดวยขอความแสดงผลการเพมขอมล ขนตอน การสรางระบบเพมขอมลทยกมาอธบายในทน แบงเปนขนตอนดงตอไปน 1. การสรางฟอรมกรอกขอมล 2. การแทรก Insert Record Server Behavior ลงในเวบเพจ 3. การสรางเวบเพจแสดงผลลพธการเพมขอมล 4. การใชงานระบบเพมขอมล (1) การสรางฟอรมกรอกขอมล การสรางฟอรมกรอกขอมล คอ ขนตอนการสรางแบบฟอรมใหผใชเวบแอพพลเคชน น าขอมลมากรอกในแบบฟอรม และสงขอมลไปประมวลผลบนแอพพลเคชนเซรฟเวอร เพอบนทกลงตารางของฐานขอมล

ขนตอนการสรางฟอรมกรอกขอมล: 1. เรมตนทโปรแกรม Dreamweaver คลกเมน File > New จะปรากฏไดอะลอก New Document ขนมา ใหคลก PHP หลงจากนนคลกปม Create บนทกเปนไฟล insert.php


2. แทรกฟอรม Inset > Form ตงชอฟอรม fmAdd และสรางฟอรมรบขอมล โดยใหมขอความและชอออบเจคตของฟอรม ดงรป

รปแสดง Property ของแทก <FORM>

รปแสดงแบบฟอรมกรอกขอมล




TextField ชอ date_born

FileField ชอ photo TextField ชอ address


Select(List/Menu) ชอ dept_id



จะเหนไดวา ในการก าหนดคณสมบตของฟอรม เราไมจ าเปนตองก าหนดคาใดๆ ในชอง Action และ Method เนองจากในขนตอนตอไป Dreamweaver จะสรางใหเราเองโดยอตโนมต (2) การแทรก Insert Record Server Behavior ลงในเวบเพจ การแทรก Insert Record Server Behavior เปนการแทรกสครปต PHP เพอบนทกขอมลลงตารางของฐานขอมล

ขนตอนการแทรก Insert Record Server Behavior ลงในเวบเพจ: 1. เปดแถบ Server Behaviors โดยคลกทแถบ Server Behaviors แลวคลกทปมเครองหมายบวก เลอกรายการ Insert Record จากเมนดงรป

รปแสดงการคลกเลอกเมน Insert Record จาก Server Behaviors

2. เมอปรากฏไดอะลอก Insert Record ขนตอนตอจากน กจะเปนการก าหนดคาในไดอะลอก Insert Record ซงรายละเอยดการก าหนดคาตางๆ มดงตอไปน


รปแสดงไดอะลอก Insert Record คาของไดอะลอก คาทก าหนด

Submit Values From fmAdd Connection dbconn Insert Table employee Columns จบคฟลดของฐานขอมลกบออบเจคตของฟอรมดงตอไปน ชอฟลดในตาราง ชอ TextField, Select(List/menu), FileField

name name lastname lastname gender gender salary salary dept_id dept_id address address

photo photo After Inserting, Go To insertok.php

ชอฟอรม fmAdd

เลอก connection ท

สรางไวคอ dbconn

จบคฟลดในตาราง

และในฟอรม

คลกเพอตรวจสอบการ

จบค

หลงจากทกดป มบนทกแลว ใหเรยกไฟล insertok.php


3. บนทกไฟล insert.php กเปนอนเสรจขนตอนการแทรก Insert Record Server behavior

(3) แทรก Select(list/menu) การแทรก Select(List/Menu) แบงเปน 2 ขนตอน คอ

1) ขนตอนการสราง record set ส าหรบตาราง department 2) ขนตอนการแทรก Select(List/Menu)

ขนตอนการสราง record set ส าหรบตาราง department 1. เปดแถบ Server Behavior แลวคลกทปมเครองหมายบวก และเลอกรายการ Recordset


2. จากหนาตาง Recordset ใหก าหนดคาส าหรบ record set ตาราง department ดงน

และคลกปม OK ขนตอนการแทรก Select(List/Menu) 1. คลกท Select(list/menu) ของ dept_id เพอก าหนด properties

ตงชอวา dept_id

ตงชอ record set คอ rsDep

เลอก connection ท

สรางไวคอ dbconn

เลอกตาราง

department

เรยงขอมล โดยใช dept_id

เรยงจากนอยไปมาก


2. คลกทปม Dynamic 3. จะปรากฏหนาตาง Dynamic List/menu ใหก าหนดขอมลดงรป

4. คลกปม OK หลงจากนน ใหบนทกไฟล insert.php NOTE: ส าหรบระบบแกไขขอมล (ไฟล update.php) การปรบเปลยน Text Field ใหเปน Select (List/Menu) กท าตาม 3 ขนตอนทไดกลาวมาเชนเดยวกน โดยในขนตอนท "(3) การก าหนด Property ของ List/Menu ใหเปนแบบ Dynamic" ใหก าหนดคาในชอง Select value equal to ใหมคาเทากบ <?php echo $row_rsEmp[‘dept_id’]; ?> หรอโดยการคลกเลอกจากไดอะลอก Dynamic Data ดงรปดานลาง

ฟลด dept_id จากฟอรม fmAdd

เลอกมาจาก reDep

น า dept_id ไปคน

คนหาชอแผนก deptname


รปแสดงไดอะลอก Dynamic List/Menu ของระบบแกไขขอมล

(4) การสรางเวบเพจแสดงผลลพธการเพมขอมล

ขนตอนสดทายของระบบเพมขอมลคอ การสรางไฟลแสดงผลการท างาน ซงจะประกอบดวยขอความ แสดงใหผใชทราบวาการกรอกขอมลเสรจเรยบรอยแลวเทานน ใหสรางเวบเพจขนมาและพมพขอความส าหรบแสดงผลการเพมขอมล บนทกเปนไฟล Insertok.php (5) การใชงานระบบเพมขอมล

เรมตนโดยใชโปรแกรม Dreamweaver เปดไฟล insert.php ขนมา แลวกดปม

F12 โปรแกรม Internet Explorer จะถกเปดขนมาเรยกใชงานไฟล insert.php หลงจากนน

ใหทดลองกรอกขอมลและคลกปม Insert เพอบนทกขอมล เสรจแลวรอดผลทจะแสดงจาก

ไฟล insertok.php




บทท 11 การสรางระบบแกไขขอมล

ระบบแกไขขอมล คอระบบเวบเพจทจดท าขนเพอใหผใชสามารถเรยกดขอมลเรคอรดเดมจากตารางของฐานขอมล และผใชสามารถแกไข ปรบปรงขอมลใหเปนปจจบน หลงจากนนกสามารถบนทกขอมลทแกไขแลวลงในตารางของฐานขอมลได

รปแสดงไฟลทเกยวของในระบบแกไขขอมล

ระบบแกไขขอมลทจะยกตวอยางน ประกอบดวยไฟล 2 ไฟล ดงรป 1) update.php ประกอบดวย ฟอรมส าหรบแสดงขอมลเดมเพอใหผใชปรบปรงแกไขขอมลและ สครปต PHP ส าหรบจดเกบขอมลทแกไขปรบปรงแลวลงตารางของฐานขอมล 2) updateok.php ส าหรบแสดงขอความแจงผลการแกไขปรบปรงขอมล ขนตอนการสรางระบบแกไขขอมลทยกมาอธบายในทน แบงเปนขนตอนดงตอไปน 1. การสรางฟอรมส าหรบแกไขขอมล 2. การสราง recordset ส าหรบคนหาขอมลเรคอรดทตองการแกไข 3. การแทรกสครปตส าหรบแสดงขอมลเดมในฟอรม HTML 4. การแทรก Update Record Server Behavior ลงในเวบเพจ 5. การสงและรบคา URL Parameter เพอระบเรคอรดทตองการแกไข 6. การแสดงผลการแกไขขอมล 7. การใชงานระบบแกไขขอมล


(1) การสรางฟอรมส าหรบแกไขขอมล ขนตอนแรกน จะเปนการแทรกฟอรมลงไปในเวบเพจ ส าหรบเปนแบบฟอรมเพอแสดงผลขอมลปจจบน และผใชงานเวบแอพพลเคชน สามารถแกไขขอมล และบนทกการแกไขลงในฐานขอมลได ขนตอนการสรางฟอรมส าหรบแกไขขอมล: 1. เรมตนทโปรแกรม Dreamweaver คลกเมน File > New จะปรากฏไดอะลอก New Document ขนมา ใหคลก PHP หลงจากนนคลกปม Create บนทกเปนไฟล update.php 2. แทรกฟอรม insert > form และตงชอฟอรม fmUpdate และสรางฟอรมส าหรบแกไขขอมลลงในเวบเพจ โดยใหมขอความและชอออบเจคตของฟอรมตามทระบในตาราง ดงรป

รปแสดงแบบฟอรมส าหรบแกไขขอมล




TextField ชอ born_date


TextField ชอ dept_id

TextArea ชอ address

TextField ชอ photo


(2) การสราง recordset ส าหรบคนหาขอมลเรคอรดทตองการแกไข ขนตอนนจะเปนการคนหาขอมลเรคอรดทตองการแกไขเพอน าเอามาแสดงในฟอรม เปนการแสดงสถานะของขอมลปจจบน กอนทจะมการแกไขปรบปรงขอมล ขนตอนการสราง recordset ส าหรบคนหาขอมลเรคอรดทตองการแกไข: 1. คลกทแถบ Server Behaviors หลงจากนนใหคลกปมเครองหมายบวก และเลอกรายการ Recordset

รปแสดงการคลกเลอกเมน Recordset จาก Server Behaviors

2. เมอปรากฏไดอะลอก Recordset ขนมา ใหก าหนดคาตางๆ ดงรายละเอยดขางลางน หลงจากนนคลกปม OK

รปแสดงไดอะลอก Recordset

3. บนทกไฟล Update.php

ชอ record set

เลอก connection คอ

dbconn

เลอกตาราง employee

กรองขอมลตาม emp_id

URL ทสงมากรอง


(3) การแสดงขอมลเดมในฟอรม HTML การแสดงขอมลลงในฟอรม กคอการแทรกสครปตส าหรบน าเอาฟลดจากการสราง Recordset ในขนตอนการคนหาขอมลมาแสดงผลในฟอรมของเวบเพจ เพอแสดงขอมลปจจบน กอนทจะแกไขปรบปรง โดยวธการจะคลายกบขนตอนการท าระบบแสดงผลขอมลในไฟล detail.php

ขนตอนการแทรกสครปตส าหรบแสดงขอมลเดมในฟอรม HTML:

1. เปดไฟล update.php คลกทแถบ Bindings หลงจากนนใหคลกเครองหมายบวก หนารายการ Recordset (rsEmp) จะปรากฏชอฟลด ใหคลกเลอกและแทรกฟลดลง

ในออบเจคตของฟอรมเพอแสดงผลขอมล ดงรปดานลาง

ในสวนของรปภาพแกไขขอมลในสวนของ Properties ดงน


พมพชอโฟลเดอรรปภาพ 2. บนทกไฟล update.php กเปนอนเสรจการแสดงผลขอมลลงในฟอรม (4) การแทรก Update Record Server Behavior ลงในเวบเพจ การแทรก Update Record Server Behavior กคอการแทรกสครปต PHP เพอสงใหบนทกการแกไขขอมลลงตารางของฐานขอมล

ขนตอนการแทรก Update Record Server Behavior ลงในเวบเพจ: 1. เปดไฟล update.php หลงจากนนใหคลกเมาสทต าแหนงใดๆ ภายใตเสนประสแดง ทเปนขอบเขตของฟอรม

2. คลกเมน Insert > Form > Hidden Field หลงจากนนคลกเมาสทออบเจคต Hidden Field จะปรากฏไดอะลอก Properties ของ Hidden Field (หากไมปรากฏไดอะลอก Properties ใหคลกทเมน Windows > Properties) และใหก าหนดคาในไดอะลอก ดงตอไปน

คาของไดอะลอก คาทก าหนด HiddenField key_empid Value <?php echo $row_rsEmp[‘emp_id’]; ?> ตารางแสดงการก าหนด Property ของ Hidden Field "key_empid"

คลกเพอเลอกฟลด emp_id


รปแสดงการก าหนด Property ของ Hidden Field "emp_id" 3. เปดแถบ Server Behaviors โดยคลกแถบ Server Behaviors แลวคลกทปมเครองหมายบวก เลอกรายการ Update Record จากเมน

ตารางแสดง Update Record Server Behaviors

4. เมอปรากฏไดอะลอก Update Record ใหก าหนดคาตางๆ มดงตอไปน

รปแสดงการก าหนดคาตางๆ ในไดอะลอก Update Record

คาของไดอะลอก คาทก าหนด Submit Values From fmUpdate Connection Dbconn Update Table Employee


Columns จบคฟลดของฐานขอมลกบออบเจคตของฟอรมดงตอไปน emp_id -> FORM.emp_id name -> FORM.name lastname -> FORM.lastname gender –> FORM.gender salary -> FORM.salary dept_id -> FORM.dept_id address -> FORM.address photo -> FORM.photo

After Updating, Go To

updateok.php

ตารางแสดงการก าหนดคาตางๆ ในไดอะลอก Update Record 6. บนทกไฟล update.php กเปนอนเสรจขนตอนการแทรก Update Record Server behavior (5) การสงและรบคา URL Parameter เพอระบเรคอรดทตองการแกไข ขนตอนน กคอการท าใหไฟลเวบเพจ 2 ไฟล list.php และ update.php สามารถเชอมโยงเพอสงและรบคา URL Parameter กนไดนนเอง ขนตอนการสงและรบคา URL Parameter เพอระบเรคอรดทตองการแกไข: 1. เรมตนทโปรแกรม Dreamweaver เปดไฟล list.php ขนมา แลวลากเมาสท า ไฮไลตขอความ "แกไข" ดงรป

รปแสดงการไฮไลตขอความ "แกไข"


2. เปดแถบ Server Behavior และคลกทเครองหมายบวก และเลอกรายการ Go To Detail Page เพอก าหนดการสง URL ดงรป

6. บนทกไฟล list.php กเปนเสรจขนตอนการก าหนดการสงคา URL Parameter (6) การแสดงผลลพธการแกไขขอมล

ขนตอนสดทายของระบบแกไขขอมลคอ การสรางไฟลแสดงผลการท างาน ซงจะ

ประกอบดวยขอความแสดงใหผใชทราบวาการแกไขขอมลเสรจเรยบรอยแลวเทานน ให

สรางเวบเพจขนมาและพมพขอความส าหรบแสดงผลการแกไขขอมล บนทกเปนไฟล

updateok.php

โปรแกรม updateok.php

เลอกชอไฟลทตองการสง URL

เลอก record set

เลอกฟลดทสงคา


(7) การใชงานระบบแกไขขอมล เรมตนโดยใชโปรแกรม Dreamweaver เปดไฟล list.php ขนมา แลวกดปม F12 โปรแกรม Internet Explorer จะถกเปดขนมาเรยกใชงานไฟล list.php หลงจากนนใหคลกปม "แกไข" เพอแกไขขอมลแตละเรคอรด เสรจแลวคลกปม Update เพอบนทกขอมล รอดผลทจะแสดงจากไฟล updateok.php


บทท 12 การตรวจสอบขอมลของฟอรม (Form Validation)

การตรวจสอบขอมลของฟอรม คอ ขนตอนทชวยในการตรวจสอบใหขอมลทรบจากฟอรม HTML มความถกตอง ตรงตามทตองการใหมากทสด โดยการตรวจสอบสามารถสรางท าไดหลายวธการ ในทนจะยกวธการใช Extension ชอ Validate Form ซงผสามารถดาวนโหลดและน ามาตดตง วธการ 1. แทรกฟอรม insert > Form และตงชอฟอรม validate และสรางแบบฟอรมเพอรบขอมล ดงรป

2. เรยกใช validate form โดยเลอกเมน insert > Validate Form จะปรากฏหนาตาง Validate Form ซงมรายละเอยดดงรป

TextField ชอ code

TextField ชอ fname

TextField ชอ code

TextField ชอ email


ผลการตรวจสอบ

ชอฟอรมทตองการตรวจสอบ ฟลดทตองการตรวจสอบ

ใหเปนคาวางไดหรอไม Anything รบทกตว Alphanumeric ตวเลขและอกษร

number เฉพาะตวเลข

ตวเลขและชวงตวเลข

รบเฉพาะตวอกษรทตองการ

ไมรบตวอกษรทก าหนดให

รปแบบเวลา

รปแบบวนเดอนป

รปแบบ E-mail

ความยาวของขอความ

ขอความแจง error


บทท 13 การสรางระบบลบขอมล

ระบบลบขอมล คอ เวบเพจทท าหนาทในการแสดงขอมลเพอยนยนการลบ และท าการลบขอมลออกจากฐานขอมล

รปแสดงไฟลทเกยวของในระบบลบขอมล

ระบบลบขอมล ในทนจะประกอบดวยไฟล 2 ไฟล 1) delete.php เปนเวบเพจทประกอบดวยฟอรมส าหรบคลกปม "ตกลง" และ "ยกเลก" เพอยนยนหรอยกเลกการลบขอมลรวมทงสครปตส าหรบการลบขอมลออกจากฐานขอมล 2) deleteok.php เปนเวบเพจทท าหนาทแสดงขอความผลการลบขอมล ขนตอนการสรางระบบลบขอมลทยกมาอธบายในทน แบงเปนขนตอนดงตอไปน 1. การสรางฟอรมและตารางแสดงขอมลทตองการลบ 2. การสราง Recordset เพอคนหาขอมลเรคอรดทตองการลบ 3. การแทรกสครปต Delete Record Server Behavior 4. การสงและรบคา URL Parameter เพอคนหาขอมลเรคอรดทตองการลบ 5. การแสดงผลลพธการลบขอมล 6. การใชงานระบบลบขอมล


(1) การสรางฟอรมและตารางแสดงขอมลทตองการลบ ขนตอนแรกน จะเปนการแทรกฟอรมและตารางลงไปในเวบเพจ ส าหรบแสดงผลขอมลปจจบน เพอใหผใชสามารถยนยนหรอยกเลกการลบขอมลได ขนตอนการสรางฟอรมและตารางแสดงขอมลทตองการลบ: 1. เรมตนทโปรแกรม Dreamweaver คลกเมน File > New จะปรากฏไดอะลอก New Document ขนมา เลอก PHP หลงจากนนคลกปม Create บนทกเปนไฟล delete.php 2. แทรกฟอรม insert > Form และตงชอฟอรม fmDelete และสรางตาราง ปรบแตงรปแบบของเวบเพจโดยใช Background Image ไฟลรปภาพ รวมทงขอความ ดงรปดานลาง

รปแสดงหนาจอยนยนการลบขอมล

(2) การสราง Recordset เพอคนหาขอมลเรคอรดทตองการลบ ขนตอนนจะเปนการคนหาเอาขอมลเรคอรดทตองการลบ เพอน าเอามาแสดงในตารางใหผใชยนยนหรอยกเลกการลบ ขนตอนการสราง Recordset เพอคนหาขอมลเรคอรดทตองการลบ: 1. คลกทแถบ Server Behaviors หลงจากนนใหคลกปมเครองหมายบวก และเลอกรายการ Recordset




Button ตกลง Action : Submit และ Button ยกเลก Action : Reset


รปแสดงการคลกเลอกเมน Recordset จาก Server Behaviors

2. เมอปรากฏไดอะลอก Recordset ขนมา ใหก าหนดคาตางๆ ดงรายละเอยดขางลางน หลงจากนนคลกปม OK

รปแสดงไดอะลอก Recordset

3. น าคาฟลดในตารางมาวางในแบบฟอรมทสรางไว โดยคลกทแถบ BINDINGS และคลกเครองบวกหนา RecordSet(reEmp) จากนนฟลดมาวางลงในตาราง


ส วนรป หลงจากทน าฟลด photo มาวางในรปแลว ให เปด properties และแกไขรายการใน Src โดยเพม photos ซงเปนโฟลเดอรเกบรปภาพ ดงน

4. แทรก Hidden Field ชอ key_empid เพอเกบคา URL ทสงมาจากโปรแกรม list.php จากนนคลกเครองหมาย Blind to Dynamic Source (สายฟาสเหลอง) เพอเลอกฟลด emp_id


5. บนทกไฟล delete.php กเปนอนเสรจการแสดงผลขอมลลงเวบเพจ (3) การแทรกสครปต Delete Record Server Behavior 1. เปดแถบ Server Behaviors โดยคลกทแถบ Server Behaviors แลวคลกทปมเครองหมายบวก เลอกรายการ Delete Record จากเมน

ตารางแสดง Delete Record Server Behaviors

2. เมอปรากฏไดอะลอก Delete Record ใหเราก าหนดคาในไดอะลอก Delete Record ก าหนดคาตางๆ ดงตอไปน


รปแสดงการก าหนดคาตางๆ ในไดอะลอก Delete Record

3. บนทกไฟล delete.php กเปนอนเสรจขนตอนการแทรก Delete Record Server behavior (4) การสงและรบคา URL Parameter เพอคนหาขอมลเรคอรดทตองการลบ ขนตอนน กคอการท าใหไฟลเวบเพจ 2 ไฟล list.php และ delete.php สามารถเชอมโยงเพอสงและรบคา URL Parameter กนไดนนเอง ขนตอนการสงและรบคา URL Parameter เพอคนหาขอมลเรคอรดทตองการลบ: 1. เปดไฟล list.php ขนมา แลวลากเมาสท าไฮไลตขอความ "ลบ"

รปแสดงการลากเมาสท าไฮไลตขอความ "ลบ"

2. คลกทแถบ Server Behavior คลกทเครองหมายบวก และเลอก Go To Detail Page for PHP จากนนก าหนดรายละเอยด ดงรป

ชอ Connection

ชอตาราง

url ทสงมาจากฟอรม

หลงจากลบแลวเรยกไฟลหนมาแสดง

เลอก Form Variable


3. บนทกไฟล list.php กเปนเสรจขนตอนการก าหนดการสงคา URL Parameter 4. ขนตอนสดทายคอก าหนดใหไฟล delete.php รบคา URL Parameter ทสงมาจากไฟล list.php ซงวธการท านน เราไดท าผานมาแลวใหยอนกลบไปดในขนตอน "การสราง Recordset เพอคนหาขอมลเรคอรดทตองการลบ" จะเหนไดวา เราไดมการเรยกใช URL Parameter ‚emp_id‛ ซงกคอคา URL Parameter ทสงไปจากไฟล list.php นนเอง (5) การแสดงผลลพธการลบขอมล ขนตอนสดทายของระบบลบขอมลคอ การสรางไฟลแสดงผลการท างาน ซงจะประกอบดวยขอความแสดงใหผใชทราบวาการลบขอมลเสรจเรยบรอยแลวเทานน ใหสรางเวบเพจขนมาและพมพขอความส าหรบแสดงผลการลบขอมล บนทกเปนไฟล deleteok.php รปแสดงเวบเพจแสดงผลลพธการลบขอมล (6) การใชงานระบบลบขอมล เรมตนโดยใชโปรแกรม Dreamweaver เปดไฟล list.php ขนมา แลวกดปม F12 โปรแกรม Internet Explorer จะถกเปดขนมาเรยกใชงานไฟล list.php หลงจากนนใหคลกปม "ลบ" เพอลบขอมลทละเรคอรด เสรจแลวคลกปม ตกลง หรอ ยกเลก เพอยนยนหรอยกเลกการลบขอมล รอดผลการท างานทจะแสดงผลจากไฟล deleteok.php

ขอความทเลอกคอ “ลบ”

เลอกไฟลทจะสง URL

ชอ record set

ฟลดทสง URL

Doc2

Documents