การทำ Pagination ใน Frontend (J1.0)

แก้ไขล่าสุด ใน วันพฤหัสบดีที่ 30 กันยายน 2553 เวลา 23:45 น.
เขียนโดย ประสิทธิ์ เก็บทรัพย์
วันอาทิตย์ที่ 22 มิถุนายน 2551 เวลา 17:47 น.
การแสดงผลแบบแบ่งหน้าเป็นสิ่งจำเป็นที่เราต้องใช้อยู่เสมอในการเขียนโปแกรมทั้งส่วนของ Frontend และ Backend ซึ่งท่านที่มีประสบการณ์เขียนมาบ้างคงพอจะทำได้อย่างง่ายๆ ซึ่งการแสดงผลแบบแบ่งหน้าจะมีการการจำกัดการแสดงผลต่อหน้า เช่น 50 รายการต่อหน้า และมีการแสดง Link ให้ click เพื่อดูการแสดงผลในส่วนที่เหลือ ดูรูปที่ 1 โดยในการทำ Pagination นี้เราจะมีการใช้งาน class ของ Joomla! ตัวหนึ่ง คือ mosPageNav ดูตัวอย่าง
function listSipAccount( $option, $limitstart, $limit ) {
global $mosConfig_absolute_path,
$mainframe,
$asterdb,
$Itemid;
require_once ($mosConfig_absolute_path.DIRECTORY_SEPARATOR."includes".DIRECTORY_SEPARATOR."pageNavigation.php");
//getUserStateFromRequest not work in frontend
//$search = $mainframe->getUserStateFromRequest("search{$option}", "search","");
$search =
strval(mosGetParam
($_REQUEST,
"search",
"") );
$mainframe->setPageTitle( "SIP account list" );
$total = asterProvHelper::totalSipAccounts( $search );
$pageNav = new mosPageNav( $total, $limitstart, $limit );
$rows = asterProvHelper::listSipAccounts($pageNav->limitstart, $pageNav->limit, $search);
HTML_asterProv::showAccountList($option, $Itemid, $rows, $pageNav, $search);
}
function%20listSipAccount%28%20%24option%2C%20%24limitstart%2C%20%24limit%20%29%20%7B%0A%C2%A0global%20%24mosConfig_absolute_path%2C%20%24mainframe%2C%20%24asterdb%2C%20%24Itemid%3B%0A%C2%A0require_once%20%28%24mosConfig_absolute_path.DIRECTORY_SEPARATOR.%22includes%22.DIRECTORY_SEPARATOR.%22pageNavigation.php%22%29%3B%0A%C2%A0%2F%2FgetUserStateFromRequest%20not%20work%20in%20frontend%0A%C2%A0%2F%2F%24search%20%3D%20%24mainframe-%3EgetUserStateFromRequest%28%22search%7B%24option%7D%22%2C%20%22search%22%2C%22%22%29%3B%0A%C2%A0%24search%20%3D%20strval%28mosGetParam%28%24_REQUEST%2C%20%22search%22%2C%20%22%22%29%20%29%3B%0A%C2%A0%24search%20%3D%20strtolower%28trim%28%20%24search%20%29%29%3B%0A%C2%A0%24mainframe-%3EsetPageTitle%28%20%22SIP%20account%20list%22%20%29%3B%20%0A%C2%A0%24total%20%3D%20asterProvHelper%3A%3AtotalSipAccounts%28%20%24search%20%29%3B%0A%C2%A0%24pageNav%20%3D%20new%20mosPageNav%28%20%24total%2C%20%24limitstart%2C%20%24limit%20%29%3B%0A%C2%A0%24rows%20%3D%20asterProvHelper%3A%3AlistSipAccounts%28%24pageNav-%3Elimitstart%2C%20%24pageNav-%3Elimit%2C%20%24search%29%3B%0A%C2%A0HTML_asterProv%3A%3AshowAccountList%28%24option%2C%20%24Itemid%2C%20%24rows%2C%20%24pageNav%2C%20%24search%29%3B%0A%7D
ใน function นี้มีตัวแปรที่เราต้องใช้สองตัวคือ $limitstart และ $limit ซึ่งเป็นตัวแปรที่ได้จาก mosPageNav โดยในการใช้งาน mosPageNav จะมีตัวแปรอีกตัวหนึ่งก็คือ $total เป็นจำนวน record ที่มีทั้งหมดเพื่อใช้ในการแบ่งหน้า
$total จำนวน record ทั้งหมดก่อนการแบ่งหน้า ซึ่งเราต้องทำการ query จากฐานข้อมูล ในที่นี้ผมใช้ Static class ในการ query จำนวน record
$limitstart record ที่ต้องการให้เริ่มแสดง หน้าแรกคือ ศูนย์
$limit จำนวนรายการต่อหน้า
$limit =
intval( mosGetParam
( $_REQUEST,
'limit',
50 ) );
$limitstart =
intval( mosGetParam
( $_REQUEST,
'limitstart',
0 ) );
%24limit%C2%A0%C2%A0%C2%A0%C2%A0%C2%A0%C2%A0%20%C2%A0%3D%20intval%28%20mosGetParam%28%20%24_REQUEST%2C%20%27limit%27%2C%2050%20%29%20%29%3B%0A%24limitstart%20%C2%A0%3D%20intval%28%20mosGetParam%28%20%24_REQUEST%2C%20%27limitstart%27%2C%200%20%29%20%29%3B%20
ในส่วนของการแสดงผล (HTML) ผมขอยกมาบางส่วนนะครับ
function showAccountList($option, $Itemid, &$rows, &$pageNav, &$search) {
HTML_asterProv::showToolbar();
$complink = "index.php?option=$option";
?>
<form name="adminForm" method="post" action="index.php?option=<?php echo $option?>&Itemid=<?php echo $Itemid?>">
<table width="100%">
<tr>
<td width=
"30%"><?php
echo "Display ".
$pageNav->
writePagesCounter() ?></td>
<td width="30%">Search account <input type="text" name="search"
value="<?php echo $search?>" onchange="document.adminForm.submit();" class="inputbox" /></td>
<td width=
"20%">Display per page
<?php echo $pageNav->
writeLimitBox($complink); ?></td>
</tr>
</table>
//...................
<?php
echo "<br /><div>".
$pageNav->
writePagesLinks($complink).
"</div>";
HTML_asterProv::showFooter();
}
-
%C2%A0%0A%C2%A0function%20showAccountList%28%24option%2C%20%24Itemid%2C%20%26amp%3B%24rows%2C%20%26amp%3B%24pageNav%2C%20%26amp%3B%24search%29%20%7B%0A%C2%A0%C2%A0HTML_asterProv%3A%3AshowToolbar%28%29%3B%0A%C2%A0%C2%A0%24complink%20%3D%20%22index.php%3Foption%3D%24option%22%3B%0A%3F%3E%0A%C2%A0%C2%A0%3Cform%20name%3D%22adminForm%22%20method%3D%22post%22%20action%3D%22index.php%3Foption%3D%3C%3Fphp%20echo%20%24option%3F%3E%26amp%3BItemid%3D%3C%3Fphp%20echo%20%24Itemid%3F%3E%22%3E%0A%C2%A0%C2%A0%3Ctable%20width%3D%22100%25%22%3E%0A%C2%A0%C2%A0%3Ctr%3E%0A%C2%A0%C2%A0%C2%A0%3Ctd%20width%3D%2230%25%22%3E%3C%3Fphp%20echo%20%22Display%20%22.%24pageNav-%3EwritePagesCounter%28%29%20%3F%3E%3C%2Ftd%3E%0A%C2%A0%C2%A0%C2%A0%3Ctd%20width%3D%2230%25%22%3ESearch%20account%C2%A0%3Cinput%20type%3D%22text%22%20name%3D%22search%22%20%0Avalue%3D%22%3C%3Fphp%20echo%20%24search%3F%3E%22%20onchange%3D%22document.adminForm.submit%28%29%3B%22%20class%3D%22inputbox%22%20%2F%3E%3C%2Ftd%3E%0A%C2%A0%C2%A0%C2%A0%3Ctd%20width%3D%2220%25%22%3EDisplay%20per%20page%C2%A0%3C%3Fphp%20echo%20%24pageNav-%3EwriteLimitBox%28%24complink%29%3B%20%3F%3E%3C%2Ftd%3E%0A%C2%A0%C2%A0%3C%2Ftr%3E%0A%C2%A0%C2%A0%3C%2Ftable%3E%0A%2F%2F...................%0A%C2%A0%C2%A0%3C%3Fphp%0A%C2%A0%C2%A0echo%20%22%3Cbr%20%2F%3E%3Cdiv%3E%22.%24pageNav-%3EwritePagesLinks%28%24complink%29.%22%3C%2Fdiv%3E%22%3B%0A%C2%A0%C2%A0HTML_asterProv%3A%3AshowFooter%28%29%3B%C2%A0%0A%C2%A0%7D%0A
โดยในส่วนของ method ที่สำคัญผมขอใช้รูปอธิบายแล้วกันนะครับ