ต่อเนื่องจากการใช้ข้อมูลในรูปแบบอาร์เรย์ของ PHP มาสร้างตารางแสดงผลวันเวลาที่มีประชุมในห้องประชุมแต่ละห้อง (ส่วนแสดงผล แบบระบายสีตามช่วงเวลา ระบบจองห้องประชุม) นำมาดัดแปลงเป็นตารางแสดงวันเวลาที่มีการอบรม โดยดึงข้อมูลมาจากฐานข้อมูล MySQL ซึ่งมีตัวอย่างโครงสร้างฐานข้อมูล และปรับเปลี่ยนวิธีการเขียนโค๊ดดังตัวอย่างต่อไปนี้
จะประกอบด้วยตาราง 3 ตัวที่ใช้ร่วมกัน ก็คือ
1) tb_course เก็บรายชื่อหัวข้อการอบรม
2) tb_course_plan เก็บข้อมูลวันเวลา หัวข้อ และชื่ออาจารย์ที่อบรม
3) tb_course_teacher เก็บข้อมูลรายชื่ออาจารย์
--
-- Table structure for table `tb_course`
--
CREATE TABLE IF NOT EXISTS `tb_course` (
`c_id` int(11) NOT NULL AUTO_INCREMENT,
`c_title` varchar(50) NOT NULL,
PRIMARY KEY (`c_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=3 ;
--
-- Dumping data for table `tb_course`
--
INSERT INTO `tb_course` (`c_id`, `c_title`) VALUES
(1, 'อบรมพื้นฐาน HTML'),
(2, 'อบรมพื้นฐาน PHP');
-- --------------------------------------------------------
--
-- Table structure for table `tb_course_plan`
--
CREATE TABLE IF NOT EXISTS `tb_course_plan` (
`cp_id` int(11) NOT NULL AUTO_INCREMENT,
`course_id` int(11) NOT NULL,
`cp_teacher_id` int(3) NOT NULL,
`cp_date` date NOT NULL,
`cp_time_start` varchar(5) NOT NULL,
`cp_time_end` varchar(5) NOT NULL,
PRIMARY KEY (`cp_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=4 ;
--
-- Dumping data for table `tb_course_plan`
--
INSERT INTO `tb_course_plan` (`cp_id`, `course_id`, `cp_teacher_id`, `cp_date`, `cp_time_start`, `cp_time_end`) VALUES
(1, 1, 1, '2014-09-01', '10:00', '12:00'),
(2, 2, 2, '2014-09-03', '14:00', '16:00'),
(3, 1, 1, '2014-09-15', '14:00', '16:00');
-- --------------------------------------------------------
--
-- Table structure for table `tb_course_teacher`
--
CREATE TABLE IF NOT EXISTS `tb_course_teacher` (
`ct_id` int(3) NOT NULL AUTO_INCREMENT,
`ct_name` varchar(50) NOT NULL,
PRIMARY KEY (`ct_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=3 ;
--
-- Dumping data for table `tb_course_teacher`
--
INSERT INTO `tb_course_teacher` (`ct_id`, `ct_name`) VALUES
(1, 'ณัฐพล หอมวิสิทธิ์'),
(2, 'องอาจ กล้าหาญ');
-- --------------------------------------------------------
ให้สังเกตุที่ตัวแปร
ตัวแปร $booking ในบทความที่แล้วคือวันเวลาที่จอง แต่ในบทความนี้จะถูกเปลี่ยนเป็น
ใช้เก็บข้อมูลวันเวลาที่มีการอบรมแทน และ id จากที่เคยเก็บเป็นไอดีของห้อง ก็ถูกเปลี่ยนไปเป็นเก็บข้อมูลวันที่ในช่วงที่เลือกมานั่นเอง
และข้อมูลกำหนดการอบรมทั้งหมดในฐานข้อมูลตามวันที่ที่เลือกก็จะถูกค้นหา และนำมาแสดงด้วยการวนลูปวันที่เริ่มต้นจนถึงวันที่สุดท้าย และในแต่ละรอบของวันที่ก็จะตรวจสอบข้อมูลใน
หวังว่าบทความนี้จะเป็นประโยชน์ต่อผู้ที่กำลังเริ่มศึกษา หากยิ่งอ่านยิ่งสับสนก็ขอให้ลองนำโค๊ดและสร้างฐานข้อมูลด้วย SQL ข้างต้นเพื่อดูผลลัพธ์ก่อน แล้วเข้ามาสอบถามกันอีกทีนะครับ ^___^
ฐานข้อมูลตัวอย่าง
จะประกอบด้วยตาราง 3 ตัวที่ใช้ร่วมกัน ก็คือ
1) tb_course เก็บรายชื่อหัวข้อการอบรม
2) tb_course_plan เก็บข้อมูลวันเวลา หัวข้อ และชื่ออาจารย์ที่อบรม
3) tb_course_teacher เก็บข้อมูลรายชื่ออาจารย์
--
-- Table structure for table `tb_course`
--
CREATE TABLE IF NOT EXISTS `tb_course` (
`c_id` int(11) NOT NULL AUTO_INCREMENT,
`c_title` varchar(50) NOT NULL,
PRIMARY KEY (`c_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=3 ;
--
-- Dumping data for table `tb_course`
--
INSERT INTO `tb_course` (`c_id`, `c_title`) VALUES
(1, 'อบรมพื้นฐาน HTML'),
(2, 'อบรมพื้นฐาน PHP');
-- --------------------------------------------------------
--
-- Table structure for table `tb_course_plan`
--
CREATE TABLE IF NOT EXISTS `tb_course_plan` (
`cp_id` int(11) NOT NULL AUTO_INCREMENT,
`course_id` int(11) NOT NULL,
`cp_teacher_id` int(3) NOT NULL,
`cp_date` date NOT NULL,
`cp_time_start` varchar(5) NOT NULL,
`cp_time_end` varchar(5) NOT NULL,
PRIMARY KEY (`cp_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=4 ;
--
-- Dumping data for table `tb_course_plan`
--
INSERT INTO `tb_course_plan` (`cp_id`, `course_id`, `cp_teacher_id`, `cp_date`, `cp_time_start`, `cp_time_end`) VALUES
(1, 1, 1, '2014-09-01', '10:00', '12:00'),
(2, 2, 2, '2014-09-03', '14:00', '16:00'),
(3, 1, 1, '2014-09-15', '14:00', '16:00');
-- --------------------------------------------------------
--
-- Table structure for table `tb_course_teacher`
--
CREATE TABLE IF NOT EXISTS `tb_course_teacher` (
`ct_id` int(3) NOT NULL AUTO_INCREMENT,
`ct_name` varchar(50) NOT NULL,
PRIMARY KEY (`ct_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=3 ;
--
-- Dumping data for table `tb_course_teacher`
--
INSERT INTO `tb_course_teacher` (`ct_id`, `ct_name`) VALUES
(1, 'ณัฐพล หอมวิสิทธิ์'),
(2, 'องอาจ กล้าหาญ');
-- --------------------------------------------------------
ซอร์สโค๊ด PHP ตัวอย่าง
$db = new dbConnect(); = เป็นคลาสเชื่อมต่อฐานข้อมูล ซึ่งแต่ละคนก็จะเขียนไม่เหมือนกัน ดูตัวอย่างโค๊ดการเชื่อมต่อฐานข้อมูลได้ที่ "การเขียน PHP เชื่อมต่อฐานข้อมูล MySQL"
<?php
/*------------------------------------------------------------------------------
** File : course_time_line.php
** Description : การดึงข้อมูลการสอน มาแสดงในรูปแบบตาราง โดยมีการระบายสีในช่วงเวลาที่มีการจองไปแล้ว
** Author : Songchai Saetern
** Email: sunzandesign@gmail.com
** Homepage : www.sunzan-design.com
** Create : 2014-09-14
**------------------------------------------------------------------------------
*/
/*
** คำนวณหาตำแหน่งซ้ายสุด และความกว้างที่จะแสดงในช่องเวลา
** ข้อกำหนดของการสร้างจำนวนคอลัมน์ เพื่อแสดงแถบเวลา
** 1 คอลัมน์ = ชั่วโมง, จะมีขนาดกว้าง 60px
** ต้องหาจุดเริ่มต้น css left
** ต้องหาความกว้าง css width
** เวลาเริ่มต้นคือ 7.00 ดังนั้นต้องลบ 7x60(420 ออกทุกครั้งที่
หา left) * แต่เมื่อมีช่องก่อนหน้า ให้เพิ่มจำนวนที่ต้องลบออกมากขึ้น
** ความกว้าง ให้ใช้ค่า end_time - start_time
*/
Class SetTimeObject
{
public $startPx;
public $diff;
public $leftMin = 0;
public $hrWidth = 60; //ความกว้างของแต่ละช่อง
public function getWidthPos($startTime, $endTime, $startHour = 7){
$startHourWidth = ($startHour * $this->hrWidth);
$s = explode(":", $startTime);
$this->startPx = ((int)$s[0] * $this->hrWidth) + (int)$s[1];
$this->diff = $this->getDiffMin($startTime, $endTime);
$l = ($this->startPx - $startHourWidth) - $this->leftMin;
$w = ($this->diff * $this->hrWidth);
return array('left' => $l, 'width' => $w);
}
//หาชั่วโมงเริ่มต้นของตารางเวลา
public function getHour($minTime){
if(is_array($minTime)){
$minTime = min($minTime);
}
$tm = explode(":", $minTime);
$number = (int)$tm[0];//เอาเฉพาะชั่วโมง
return $number;
}
public function getDiffMin($start, $end){
$t1 = explode(":", $start);
$t2 = explode(":", $end);
if(count($t1) < 3) $start .= ":00";
if(count($t2) < 3) $end .= ":00";
return (strtotime($end) - strtotime($start))/ ( 60 * 60 );
}
}
?>
<style type="text/css">
#snaptarget {
height: 50px;
background: url("http://code.jquery.com/ui/1.10.3/themes/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png") repeat-x scroll 50% 50% #CCCCCC;
}
td.room{
width : 100px;
text-align : right;
font-weight : bold;
background: url("http://code.jquery.com/ui/1.10.3/themes/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png") repeat-x scroll 50% 50% #CCCCCC;
}
.td_time{ height : 20px; }
.td_time div{
float : left;
width : 60px;
border-right : 1px solid #1AEB00;
}
.draggable2{
background: #C3FF7D;
border: 1px solid #AAAAAA;
color: #222222;
float : left;
height : 48px;
line-height : 14px;
padding : 0px;
cursor : pointer;
overflow : hidden;
text-align : center;
font-weight : 100;
position : relative;
}
.draggable2 p{
margin: 0;
padding: 5px;
}
</style>
<?php
$db = new dbConnect();
//-- กำหนดช่องเวลา แบบตายตัว
$timeArr = array("07:00", "08:00", "09:00", "10:00", "11:00", "12:00", "13:00", "14:00",
"15:00", "16:00", "17:00", "18:00", "19:00", "20:00", "21:00", "22:00"
);
//รับค่าวันที่ที่ส่งมาแบบ GET
$start_date = isset($_GET['start_date']) ? $_GET['start_date'] : date('Y-m-d');
$end_date = isset($_GET['end_date']) ? $_GET['end_date'] : date('Y-m-d', strtotime("+6 days"));
$start_time = strtotime($start_date);
$diff = (strtotime($end_date) - strtotime($start_date))/ ( 60 * 60 * 24 ); // 1 day = 60*60*24
//-- สร้างรายการแถวของช่วงวันที่ที่เลือก
$room = array();
for($i=0;$i<=$diff;$i++){
$date = date('Y-m-d', strtotime("+".$i." day", $start_time));
$room[] = array('id' => $date, 'name' => $date);
}
//-- ส่วนที่ดึงมาจากฐานข้อมูล ในลูป while
$arr_course_plan = array();
$sql = "SELECT tb_course_plan.cp_date, tb_course_plan.cp_time_start, tb_course_plan.cp_time_end,
tb_course.c_title, tb_course_teacher.ct_name
FROM tb_course_plan
INNER JOIN tb_course ON tb_course_plan.course_id = tb_course.c_id
INNER JOIN tb_course_teacher ON tb_course_plan.cp_teacher_id = tb_course_teacher.ct_id
WHERE cp_date BETWEEN '$start_date' AND '$end_date' ";
$qry = mysql_query($sql) or die(mysql_error());
while ($row = mysql_fetch_assoc($qry)) {
$arr_course_plan[$row['cp_date']][] = array(
'start_time'=> $row['cp_time_start'],
'end_time' => $row['cp_time_end'],
'title' => $row['c_title']
);
}
///----------- End of Query -------------
$objTime = new SetTimeObject;
echo '<table border="1" width="1095">';
foreach($room as $row){
echo '<tr>';
echo '<td class="room">'.$row['name'].'</td>';
echo '<td>
<div class="td_time"><div>'. implode("</div><div>", $timeArr) .'</div><div style="clear:both"></div></div>
<div id="snaptarget" class="ui-widget-header">';
if(isset($arr_course_plan[$row['id']])){
$objTime->leftMin = 0;
$startHour = $objTime->getHour($timeArr); //ชั่วโมงเริ่มต้นของตารางเวลา
$prevLeft = 0;
foreach($arr_course_plan[$row['id']] as $bookData){
$arr = $objTime->getWidthPos($bookData['start_time'], $bookData['end_time'], $startHour);
$left = $arr['left'];
$width = $arr['width'];
$objTime->leftMin += $arr['width'];
$title = $bookData['title']. ' <br/>( '. $bookData['start_time'] .'-'.$bookData['end_time'];
echo '<div class="draggable2" style="left: '.$left.'px;width: '.$width.'px" title="'.$title.'">
<p>'. $title .'</p>
</div>';
}
}
echo ' </div>
</td>';
echo '</tr>';
}
echo ' </table>';
?>
$room = array(); ซึ่งจากเดิมที่เราใช้เก็บค่าห้องประชุมต่างๆ จะถูกปรับเปลี่ยนมาเป็นเก็บวันที่ที่เลือก เช่น 2014-09-14 และ 2014-09-21 ก็จะได้ค่า $room ที่เรียงวันที่ตั้งแต่เริ่มต้นจนถึงสุดท้ายเก็บไว้ในรูปแบบอาร์เรย์ตัวแปร $booking ในบทความที่แล้วคือวันเวลาที่จอง แต่ในบทความนี้จะถูกเปลี่ยนเป็น
$arr_course_plan = array(); ใช้เก็บข้อมูลวันเวลาที่มีการอบรมแทน และ id จากที่เคยเก็บเป็นไอดีของห้อง ก็ถูกเปลี่ยนไปเป็นเก็บข้อมูลวันที่ในช่วงที่เลือกมานั่นเอง
และข้อมูลกำหนดการอบรมทั้งหมดในฐานข้อมูลตามวันที่ที่เลือกก็จะถูกค้นหา และนำมาแสดงด้วยการวนลูปวันที่เริ่มต้นจนถึงวันที่สุดท้าย และในแต่ละรอบของวันที่ก็จะตรวจสอบข้อมูลใน
$arr_course_plan ว่ามีข้อมูลของวันที่นั้นๆหรือไม่ ถ้ามีก็คำนวนจุดที่ต้องการให้แสดงผลด้วย getWidthPosหวังว่าบทความนี้จะเป็นประโยชน์ต่อผู้ที่กำลังเริ่มศึกษา หากยิ่งอ่านยิ่งสับสนก็ขอให้ลองนำโค๊ดและสร้างฐานข้อมูลด้วย SQL ข้างต้นเพื่อดูผลลัพธ์ก่อน แล้วเข้ามาสอบถามกันอีกทีนะครับ ^___^
"PHP ไม่ได้สร้างสุดยอดโปรแกรม แต่ PHP ช่วยให้งานคุณง่ายขึ้นต่างหาก"
PHP CI MANIA - PHP Code Generatorโปรแกรมช่วยสร้างโค้ด ลดเวลาการเขียนโปรแกรม
สนใจสั่งซื้อเพียง 3,990 บาท
PHP CI MANIA - PHP Code Generator
โปรแกรมช่วยสร้างโค้ด "ลดเวลาการเขียนโปรแกรม"
ส่วนของวันที่ ให้แสดง วันจันท์ถึงอาทิตได้ป่าวค่ะ ประมานว่ายังคงแสดงตามวันที่เหมือนเดิม แต่ข้างหน้าให้แสดง วันจันถึงอาทิตแทนนะค่ะ
ตอบลบ