จัดรูปแบบ การแบ่งคอลัมน์ column ของ ตาราง สำหรับแสดงข้อมูล ด้วย php

23 December 2009 เขียนเมื่อ 11 ปีก่อน โดย Ninenik Narkdee

ตาราง php

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ ตาราง php

การนำข้อมูลมาแสดง โดยจัดรูปแบบ แบ่งเป็น column สามารถทำโดยการใช้ css จัดรูปแบบ หรือ การใช้ตาราง table

หากสามารถจัดรูปแบบ column โดยการใช้ css จะเป็นการดีมาก

http://www.ninenik.com/เทคนิค_CSS_แสดงข้อมูลแบ่งเป็น_คอลัมน์_แทนการใช้ตาราง_Table-229.html

แต่หากต้องการความรวดเร็วสามารถใช้ในรูปแบบของตาราง table

ขั้นตอนการจัดคอลัมน์ ด้วยตาราง

1.กำหนดจำนวนคอลัมน์ที่ต้องการ ในที่นี้ใช้ 4 คอลัมน์

2.สร้างตาราง 1 x 4 กำหนดความกว้างตาราง ตามต้องการ (1 แถว x 4 คอลัมน์)

<table width="500" border="0" cellspacing="2" cellpadding="0">
  <tr>
    <td width="125"> </td>
    <td width="125"> </td>
    <td width="125"> </td>
    <td width="125"> </td>
  </tr>
</table>

3.แทรก php โค้ตดังตัวอย่างต่อไปนี้ (กรณีดึงจากฐานข้อมูล)

<table width="500" border="0" cellspacing="2" cellpadding="0">
<?php
$i=1;
$q="SELECT * FROM table ";   
$qr=mysql_query($q);   
$numItem=mysql_num_rows($qr);
$numCol=4;
$remainCol=$numCol-($numItem%$numCol);
while($rs=mysql_fetch_array($qr)){  
?>
<?php if($i%$numCol==1){ ?>
  <tr>
    <td width="125"><?=$rs['data']?></td>
<?php } ?>
<?php if($i%$numCol==2){ ?>    
    <td width="125"><?=$rs['data']?></td>
<?php } ?>
<?php if($i%$numCol==3){ ?>        
    <td width="125"><?=$rs['data']?></td>
<?php } ?>
<?php if($i%$numCol==0){ ?>        
    <td width="125"><?=$rs['data']?></td>
  </tr>
<?php } ?>
<?php $i++; } ?>
<?=($remainCol>0 && $remainCol!=$numCol)?"<td colspan=".$remainCol."></td></tr>":""?>  
</table>

//	คำอธิบาย
//	บรรทัดที่ 6 หาจำนวน รายการทั้งหมดที่แสดง
//	บรรทัดที่ 7 กำหนดจำนวนคอลัมน์ ตามจำนวนที่ต้องการแสดง
//	บรรทัดที่ 8 คำนวนหาจำนวนคอลัมน์ที่เหลือ กรณีข้อมูลแสดงไม่ครบทุกคอลัมน์ในแต่ละแถว
//	บรรทัดที่ 11 15 18 และ 21 เงื่อนไขสำหรับแสดงข้อมูลแต่ละ คอลัมน์ 
//	สังเกตว่า เงือนไขสำหรับคอลัมน์แรก  ใช้ <?php if($i%$numCol==1){ ?> เงื่อนไข $i%$numCol==1
//	และเงื่อนไขสำหรับคอลัมน์ต่อๆ ไปจะเป็น $i%$numCol==2 , $i%$numCol==3 ..... ไปเรื่อย ๆ 
//	จนถึง เงื่อนไขคอลัมน์สุดท้ายจะต้องกำหนดเป็น $i%$numCol==0 เสมอ
//	บรรทัดที่ 26 เงื่อนไขสำหรับกรณ๊ข้อมูลแสดงไม่ครบทุกคอลัมน์

4.เมื่อสามารถแสดงคอลัมน์ข้อมูลได้แล้ว ก็ทำการจัดรูปแบบข้อมูลที่ต้องการแสดง ในแต่ละคอลัมน์ตามต้องการ

โดยอาจแทรกตารางเข้าไปในแต่ละคอลัมน์ เพื่อจัดรูปแบบก็ได้

กด Like หรือ Share เป็นกำลังใจ ให้มีบทความใหม่ๆ เรื่อยๆ น่ะครับ