ข้ามไปที่เนื้อหาหลัก

PHP array_chunk() เทคนิคการเขียนโปรแกรมแสดงผล แบบแบ่งหลายคอลัมน์



การเขียนโปรแกรมเพื่อดึงข้อมูลออกมาจากฐานข้อมูล และจัดแสดงผล แบบหลายคอลัมน์นั้น เป็นสิ่งที่เราจะพบเห็นอยู่บ่อยๆ ในเว็บไซต์ที่เป็นร้านค้าออนไลน์ ที่จะนำสินค้ามาแสดงในหน้าแรกเพื่อให้ลูกค้าได้เลือกซื้อกันได้ง่าย และหลายรายการ เพราะแสดงเป็นแถวละรายการ คงจะเปลืองพื้นที่แสดงสินค้าหลายแถว จนหน้าเว็บอาจจะยาวทะลุจอไปเลยก็ได้



สำหรับเทคนิคการแสดงผลแบบแบ่งหลายคอลัมน์นั้น ยังนิยมอย่างมากในการทำแกลอรี่รูปภาพ ซึ่งตัวอย่างที่นำมาให้ดูนี้อาจจะคุ้นตามกันอยู่แล้ว เป็นบทความที่นำมาจากเว็บไซต์ ThaiCreate.Com

PHP MySQL Multiple Column

จากตัวอย่างกำหนดให้ $intRows นับจำนวนรายการที่ดึงออกมาจากฐานข้อมูล

 จะมีคำสั่งที่ใช้ตรวจสอบจำนวนคอลัมน์ว่าครบหรือยังเพื่อขึ้นบรรทัดใหม่โดยตรวจสอบ

24.
25.if(($intRows)%2==0)
26.{
27.echo"</tr><tr>";
28.}

ความหมายของคำสั่งนี้ก็คือ ถ้าจำนวนรายการนั้น หาร ด้วย 2 แล้วลงตัว ก็ให้ปิดแถว เพื่อขึ้นแถวใหม่
เราก็จะได้ข้อมูล 2 คอลัมน์เหมือนตัวอย่าง


ถ้ากรณีที่เรามีหน้าเว็บกว้าง มีพื้นที่เหลือด้านขวาอีกมาก จะเพิ่มเป็น 3 หรือ 4 คอลัมน์ล่ะ จะทำยังไงดี
แก้แค่ที่เดียวนี่แหละครับ เปลี่ยนจากเลข 2 เป็นเลข 3 หรือ 4 หรือจำนวนคอลัมน์ที่เราต้องการได้เลย



และแล้วก็มาถึงฟังก์ัชั่น array_chunk() ซะทีว่าจะนำมาใช้ในงานเขียนโปรแกรม อย่างไรได้บ้าง
ฟังก์่ชั่นนี้ จะทำหน้าที่แยกข้อมูลชนิดอาร์เรย์ (Array) ออกมาเป็นหลายๆ ชุดโดยแต่ละชุดจะมีจำนวนตามที่เราได้ระบุไว้ในพารามิเตอร์ตัวที่สองนั่นเอง

เช่น

<?php
$input_array = array('a', 'b', 'c', 'd', 'e');
print_r(array_chunk($input_array, 2));
?>

จะได้ผลลัพธ์เป็น

Array
(
    [0] => Array
        (
            [0] => a
            [1] => b
        )
    [1] => Array
        (
            [0] => c
            [1] => d
        )
    [2] => Array
        (
            [0] => e
        )
)

อ่านรายละเอียดเพิ่มเติมได้จากคู่มือ www.php.net

แล้วก็มาถึงการนำมาใช้แสดงผลข้อมูลให้อยู่ในรูปแบบตารางหลายคอลัมน์กันบ้าง อาจจะดูยุ่งยากไปหน่อย แต่ก็จะทำให้มองเห็นภาพได้ชัดขึ้น

<?php
$dbHost = "localhost";
$dbUser = "sunzandesign";
$dbPass = "13579";
$objConnect = mysql_connect($dbHost,$dbUser,$dbPass) or die(mysql_error());
$objDB = mysql_select_db("test");
mysql_query('SET NAMES UTF8');

$intRows = 0;
$data = array();
$strSQL = "SELECT * FROM gallery";
$objQuery = mysql_query($strSQL);
while($objResult = mysql_fetch_assoc($objQuery))
{
 $intRows++;
 $data[$intRows] = $objResult;
}

if($intRows > 0){//ถ้ามีข้อมูล ถึงจะทำงาน
 $columns = 4;
 $rows = array_chunk($data, 4);

 echo "<table border='1'>\n";
 foreach ($rows as $rowObject) {
  echo "<tr>";
  foreach ($rowObject as $objResult) {
   echo "<td>
    <center>
    <img width='150' height='170' src='". $objResult["Picture"] ."'><br />".$objResult["GalleryName"]."<br>
    </center>
    </td>";
  }
  if($cnum = count($rowObject)){//ถ้าสร้างตารางยังไม่ครบตามคอลัมน์ที่ต้องการ ให้สร้างเพิ่มจนครบ
   for($col=$cnum;$col<$columns;$col++){
    echo '<td> </td>';
   }
  }
  echo "</tr>\n";
 }
 echo "</table>\n";

}else{
    echo "ไม่พบข้อมูล.\n";
}
?>

ผลลัพธ์ที่ได้



จำนวนคอลัมน์ที่ได้นั้น ขึ้นอยู่กับตัวแปร $columns = 4; ซึ่งสามารถกำหนดได้ตามต้องการ

ถ้าเปรียนเทียบการเขียนโปรแกรมแสดงผลข้อมูลหลายคอลัมน์ แบบ ThaiCreate.Com และของผมที่ใช้ฟังก์ชั่น array_chunk() แยกอาร์เรย์ออกจากกันเป็นหลายๆ ชุด แล้ววนลูปอีกทีนั้น ดูแล้วแบบผมจะยุ่งยากกว่าใช่ไหมล่ะครับ แต่อย่าว่ากันเลยครับ ตัวอย่างก็คือตัวอย่าง แค่อยากให้มองเห็นภาพชัดเจนขึ้น


แต่สำหรับใครที่เขียนโปรแกรม PHP ด้วย CodeIgniter Framework คงพอจะมีประโยชน์อยู่บ้าง
เมื่อใช้งานร่วมกับฟังก์่ชั่น $query = $this->db->query("YOUR QUERY");


<?php
$query = $this->db->query("SELECT * FROM gallery");
$data = $query->result_array();
$rows = array_chunk($data, 4);
?>

และเริ่มวนลูปแสดงข้อมูลทั้งหมดใน $rows

จะเห็นว่าใน CodeIgniter นั้นจะมีฟังก์ชั่นที่ใ้ช้คิวรี่ข้อมูลมาเป็นอาร์เรย์ให้อยู่แล้ว หรือหลายๆ ท่านก็สร้างฟังก์ชั่นไว้ใ้ช้เองอยู่แล้ว ถ้านำวิธีการแยกข้อมูลอาร์เรย์ออกเป็นชุด เพื่อแสดงผลแบบหลายคอลัมน์ด้วย array_chunk() ก็น่าสนใจไม่น้อยทีเดียวใช่มั้ยล่ะครับ ^_^


SQL Code

--
-- Table structure for table `gallery`
--

CREATE TABLE IF NOT EXISTS `gallery` (
  `GalleryName` text NOT NULL,
  `Picture` text NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

--
-- Dumping data for table `gallery`
--

INSERT INTO `gallery` VALUES
('Into The New World', 'images/album_itnw.jpg'),
('The First Mini Album – Gee', 'images/album-gee.jpg'),
('Tell Me Your Wish (Genie)', 'images/album-genie.jpg'),
('The 1st Asia Tour : Into the New ', 'images/album_itnw_live.jpg'),
('Album – Girls’ Generation', 'images/album_gg.jpg'),
('The 3rd Album – The Boys', 'images/album_the_boys.jpg'),
('The 3rd Album – Mr.Taxi Ver', 'images/mrtaxi.jpg'),
('GIRL’S GENERATION ~The Boys~', 'images/theboys.jpg'),
('Baby Baby (Repackaged)', 'images/album-baby.jpg');




"PHP ไม่ได้สร้างสุดยอดโปรแกรม
แต่ PHP ช่วยให้งานคุณง่ายขึ้นต่างหาก"

PHP CI MANIA PHP Code Generator 
โปรแกรมช่วยสร้างโค้ด ลดเวลาการเขียนโปรแกรม

สนใจสั่งซื้อเพียง 3,990 บาท



PHP CI MANIA PHP Code Generator 

โปรแกรมช่วยสร้างโค้ด "ลดเวลาการเขียนโปรแกรม"
ราคาสุดคุ้มเพียง 3,990 บาท 
http://www.phpcodemania.com

ความคิดเห็น

โพสต์ยอดนิยมจากบล็อกนี้

แจกฟรี!! ระบบต่างๆที่พัฒนาด้วย PHP สำหรับนำไปใช้ในงานต่างๆ

       สำหรับหลายท่านที่ขอโค้ดเข้ามาทาง Inbox ของเฟซบุ๊กแฟนเพจ หรือถามถึงระบบต่างๆหลังไมค์มานั้น ส่วนใหญ่ก็มีแจกอยู่แล้วในเว็บบอร์ด ThaiCreate.Com นะครับ และด้านล่างนี้ก็เป็นระบบต่างๆที่แจกให้นำไปลองใช้ลองศึกษากันครับ

สอนเขียน PHP แสดงการจองห้องประชุมแบบไฮไลท์ตามช่วงเวลา (แบบเชื่อมต่อฐานข้อมูล MySQL)

ตัวอย่าง ผลลัพธ์ที่ได้จากการจองในฐานข้อมูล ตาราง tb_room สร้างตารางรายชื่อห้องประชุม สำหรับ id นั้นเป็น Primarykey จะกำหนดให้สร้างอัตโนมัติ ทุกครั้งที่เราเพิ่มชื่อห้องประชุมใหม่ -- -- Database: `tobedev_example` -- -- -------------------------------------------------------- -- -- Table structure for table `tb_room` -- CREATE TABLE IF NOT EXISTS `tb_room` (   `id` int(11) NOT NULL,   `name` varchar(30) NOT NULL ) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8; -- -- Dumping data for table `tb_room` -- INSERT INTO `tb_room` (`id`, `name`) VALUES (1, 'ห้องประชุม 1'), (2, 'ห้องประชุม 2'), (3, 'ห้องประชุม 3'), (4, 'ห้องประชุม 4'), (5, 'ห้องประชุม 5'); -- -- Indexes for dumped tables -- -- -- Indexes for table `tb_room` -- ALTER TABLE `tb_room`   ADD PRIMARY KEY (`id`); -- -- AUTO_INCREMENT for dumped tables -- -- -- AUTO_INCREMENT for table `tb_room` -- ALTER TABLE `tb_room`   MODIFY `i...

การนำไอคอน มาแสดงบน Fullcalendar

เนื่องจากมีน้องคนหนึ่งให้ช่วยดูโค้ดเกี่ยวกับ Fullcalendar ให้หน่อย แล้วพอดีช่วงนี้ผมก็กำลังสนใจปฏิทิน Fullcalendar อยู่พอดี จึงลองหาสาเหตุที่ไม่สามารถแสดงข้อมูลจาก MySQL และไม่สามารถแทรก icon เข้าไปใน Fullcalendar ได้ จากที่สังเกตุได้ครั้งแรกคือ Error ที่ Console ของ Firefox เกี่ยวกับฟังก์ชั่นที่เขียนผิด และก็มีการ echo ค้างไว้ในส่วนของไฟล์ getCalendar.php ก็เลยจัดการทดสอบแล้วลบ echo ออกให้เหลือแค่ echo json_encode($event_array); ที่ได้ใช้งานจริงเท่านั้น ขั้นตอนการตรวจสอบความถูกต้องของโค้ด PHP 1) ต้องแน่ใจว่าคำสั่งที่เขียนไว้ สามารถดึงข้อมูลมาแสดงผลได้ด้วยการ echo $sql; 2) นำคำสั่งที่ได้ไปรันในโปรแกรมจัดการฐานข้อมูล ในที่นี้คือ phpMyAdmin 3) เมื่อตรวจสอบดูผลลัพธ์ที่ได้ หากถูกต้องมีข้อมูลก็แสดงว่าการ Query ทำงานได้ 4) มาดูการทำงานของ JavaScript ในส่วนของ jQuery มีการแจ้งเตือนที่ฟังก์ชั่น .on() ซึ่งจะใช้กับ jQuery เวอร์ชั่นใหม่เท่านั้น นั่นหมายถึงเวอร์ชั่น jQuery ที่มากับ Fullcalendar เป็นเวอร์ชั่นเก่า ก็ให้เปลี่ยนไปใช้ .live() แทน ก็จะทำงานได้ปกติ 5) ม...