คู่มือการใช้งาน CodeIgniter เวอร์ชั่น 1.7.2


HTML Table Class

คลาส Table มีฟังก์ชันให้คุณเรียกใช้งานสำหรับ สร้าง HTML Table อย่างอัตโนมัติจากอาเรย์หรือผลลัพธ์จากฐานข้อมูล

เริ่มต้นใช้คลาส

เหมือนคลาสอื่นๆของ CodeIgniter คลาส Table นั้นเริ่มต้นได้ในตัวบควมคุม(controller) โดยใช้ฟังก์ชัน $this->load->library

$this->load->library('table');

เมื่อโหลดแล้วคุณสามารถใช้ออบเจ็คตารางได้โดยการใช้ $this->encrypt

ตัวอย่างการใช้งาน

นี้คือตัวอย่างในการสร้างตารางจากอาเรย์หลายมิติ ข้อสังเกตุว่าอาเรย์ตัวแรกนั้นจะกลายมาเป็นหัวตาราง (หรือคุณสามารถตั้งค่าหัวตารางของคุณเองได้ด้วยการใช้ฟังก์ชัน set_heading() ซึ่งจะมีอธิบายฟังก์ชันอยู่ด้านล่าง)

$this->load->library('table');

$data = array(
             array('Name', 'Color', 'Size'),
             array('Fred', 'Blue', 'Small'),
             array('Mary', 'Red', 'Large'),
             array('John', 'Green', 'Medium')
             );

echo $this->table->generate($data);

นี้คือตัวอย่างตารางที่ถูกสร้างมาจากผลลัพธ์ฐานข้อมูล คลาสตารางจะสร้างหัวตารางขึ้นเองจากชื่อตารางในฐานข้อมูล (หรือคุณสามารถตั้งค่าหัวตารางของคุณเองได้ด้วยการใช้ฟังก์ชัน set_heading() ซึ่งจะมีอธิบายฟังก์ชันอยู่ด้านล่าง)

$this->load->library('table');

$query = $this->db->query("SELECT * FROM my_table");

echo $this->table->generate($query);

นี้คือตัวอย่างสำหรับการสร้างตารางโดยสามารถใส่พารามิเตอร์กี่พารามิเตอร์ก็ได้

$this->load->library('table');

$this->table->set_heading('Name', 'Color', 'Size');

$this->table->add_row('Fred', 'Blue', 'Small');
$this->table->add_row('Mary', 'Red', 'Large');
$this->table->add_row('John', 'Green', 'Medium');

echo $this->table->generate();

นี้คือตัวอย่างเหมือนอันก่อน แต่จะใช้ด้วยพารามิเตอ์เดียวด้วยการใช้อาเรย์แทน

$this->load->library('table');

$this->table->set_heading(array('Name', 'Color', 'Size'));

$this->table->add_row(array('Fred', 'Blue', 'Small'));
$this->table->add_row(array('Mary', 'Red', 'Large'));
$this->table->add_row(array('John', 'Green', 'Medium'));

echo $this->table->generate();

เปลี่ยนรูปร่างลักษณะตาราง

คลาสตารางยอมให้คุณตั้งค่า template ซึ่งคุณสามารถปรับเปลี่ยนดีไซน์ไปเป็นแบบที่คุณต้องการได้ นี้คือ template ตัวแรกเริ่ม

$tmpl = array (
                    'table_open'          => '<table border="0" cellpadding="4" cellspacing="0">',

                    'heading_row_start'   => '<tr>',
                    'heading_row_end'     => '</tr>',
                    'heading_cell_start'  => '<th>',
                    'heading_cell_end'    => '</th>',

                    'row_start'           => '<tr>',
                    'row_end'             => '</tr>',
                    'cell_start'          => '<td>',
                    'cell_end'            => '</td>',

                    'row_alt_start'       => '<tr>',
                    'row_alt_end'         => '</tr>',
                    'cell_alt_start'      => '<td>',
                    'cell_alt_end'        => '</td>',

                    'table_close'         => '</table>'
              );

$this->table->set_template($tmpl);

ข้อสังเกตุ:  คุณจะสังเกตุได้ว่ามันมี 2 เซ็ทสำหรับบล็อคที่ขึ้นว่า "row" ใน template สิ่งเหล้านี้ยอมให้คุณเปลี่ยนสีหรือดีไซน์แบบสลับกันสำหรับข้อมูลในแถว เช่น เราจะทำสีแดงสลับสีเท่า เป็นต้น

คุณไม่จำเป็นจะต้องใส่ template ให้ครบทุกส่วน ถ้าคุณต้องการแก้ไขเพียงบางส่วนคุณก็สามารถทได้ เหมือนในตัวอย่างต่อไปนี้เฉพาะการเปิดแท็กหัวตาราง จะเปลี่ยนเท่านั้น

$tmpl = array ( 'table_open'  => '<table border="1" cellpadding="2" cellspacing="1" class="mytable">' );

$this->table->set_template($tmpl);

ฟังก์ชันอ้างอิง

$this->table->generate()

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

$this->table->set_caption()

ยอมให้คุณใส่คำบรรยายของตารางได้

$this->table->set_caption('Colors');

$this->table->set_heading()

ยอมให้คุณตั้งค่าหัวตาราง โดยสามารถได้ทั้งแบบอาเรย์ แล้วแบบพารามิเตอร์ไม่จำกัด

$this->table->set_heading('Name', 'Color', 'Size'); $this->table->set_heading(array('Name', 'Color', 'Size'));

$this->table->add_row()

ยอมให้คุณเพิ่มแถวลงไปในตารางของคุณ ซึ่งคุณสามารถใส่แบบอาเรย์หรือพารามิเตอร์ไม่จำกัดได้

$this->table->add_row('Blue', 'Red', 'Green'); $this->table->add_row(array('Blue', 'Red', 'Green'));

$this->table->make_columns()

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

$list = array('one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve');

$new_list = $this->table->make_columns($list, 3);

$this->table->generate($new_list);

// สร้างตารางจาก template เริ่มต้น

<table border="0" cellpadding="4" cellspacing="0">
<tr>
<td>one</td><td>two</td><td>three</td>
</tr><tr>
<td>four</td><td>five</td><td>six</td>
</tr><tr>
<td>seven</td><td>eight</td><td>nine</td>
</tr><tr>
<td>ten</td><td>eleven</td><td>twelve</td></tr>
</table>

$this->table->set_template()

เป็นการเปลี่ยน template ซึ่งคุณสามารถใส่ทั้งหมดหรือบางส่วนของ template ก็ได้

$tmpl = array ( 'table_open'  => '<table border="1" cellpadding="2" cellspacing="1" class="mytable">' );

$this->table->set_template($tmpl);

$this->table->set_empty()

ให้คุณตั้งค่า default value สำหรับใช้ในตารางใดๆที่มีค่าว่าง ซึ่งคุณอาจจะตั้งเป็น non-breaking space ดังตัวอย่าง

$this->table->set_empty("&nbsp;");

$this->table->clear()

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

$this->load->library('table');

$this->table->set_heading('Name', 'Color', 'Size');
$this->table->add_row('Fred', 'Blue', 'Small');
$this->table->add_row('Mary', 'Red', 'Large');
$this->table->add_row('John', 'Green', 'Medium');

echo $this->table->generate();

$this->table->clear();

$this->table->set_heading('Name', 'Day', 'Delivery');
$this->table->add_row('Fred', 'Wednesday', 'Express');
$this->table->add_row('Mary', 'Monday', 'Air');
$this->table->add_row('John', 'Saturday', 'Overnight');

echo $this->table->generate();