Ứng dụng mã nguồn NukeViet

https://mynukeviet.net


Kỹ thuật phân trang ajax trong NukeViet

Kỹ thuật phân trang ajax hiện đang rất phổ biến trong các hệ thống, việc chuyển trang ajax giúp nâng cao trải nghiệm người dùng, tiện lợi hơn trong việc xem danh sách.
Demo: Code phân trang ajax trong NukeViet
Trước hết, bạn cần tìm hiểu thêm về hàm nv_generate_page và các tham số đầy đủ của nó.
nv_generate_page ( $base_url, $num_items, $per_page, $start_item, $add_prevnext_text = true, $onclick = false, $js_func_name = 'nv_urldecode_ajax', $containerid = 'generate_page' )
Mã PHP
$_id = $nv_Request->get_int( 'id', 'get', 0 );
$base_url = NV_BASE_SITEURL . 'index.php?' . NV_LANG_VARIABLE . '=' . NV_LANG_DATA . '&' . NV_NAME_VARIABLE . '=' . $module_name . '&' . NV_OP_VARIABLE . '=' . $op . '&ajax=1&id=' . $_id;
$ajax = $nv_Request->get_int( 'ajax', 'get', 0 );
if( $ajax )
{
	$array_data = array( );
	$page = $nv_Request->get_int( 'page', 'get', 1 );
	$per_page = 5;
	// Fetch Limit
	$db->sqlreset( )->select( 'COUNT(*)' )->from( NV_PREFIXLANG . '_news_rows' )->where( 'status=1' );
	$num_items = $db->query( $db->sql( ) )->fetchColumn( );
	$db->select( '*' )->order( 'id DESC' )->limit( $per_page )->offset( ($page - 1) * $per_page );
	$_query = $db->query( $db->sql( ) );
	while( $row = $_query->fetch( ) )
	{
		$array_data[] = $row;
	}	$generate_page = nv_generate_page( $base_url, $num_items, $per_page, $page, 'true', 'false', 'nv_urldecode_ajax', 'listnews' );
	if( !empty( $array_data ) )
	{
		$i = 1;
		foreach( $array_data as $data )
		{
			$data['no'] = $i;
			$data['addtime'] = nv_date( 'd/m/Y', $data['addtime'] );
			$xtpl->assign( 'DATA', $data );
			$xtpl->parse( 'listnews.loop' );
			$i++;
		}
	}
	if( !empty( $generate_page ) )
	{
		$xtpl->assign( 'PAGE', $generate_page );
		$xtpl->parse( 'listnews.generate_page' );
	}	$xtpl->parse( 'listnews' );
	$contents = $xtpl->text( 'listnews' );
	echo $contents;
	die( );
}

Mã HTML
<!-- BEGIN: listnews -->
<div class="table-responsive">
	<table class="table table-striped table-bordered table-hover">
		<colgroup>
			<col width="60">
			<col span="1">
			<col class="w100">
		</colgroup>
		<thead>
			<tr class="text-center">
				<th class="text-center">Thứ tự</th><th>Tên bài viết</th><th>Thời gian đăng</th>
			</tr>
		</thead>
		<tbody>
			<!-- BEGIN: loop -->
			<tr>
				<td class="text-center">{DATA.no}</td><td>{DATA.title}</td><td>{DATA.addtime}</td>
			</tr>
			<!-- END: loop -->
		</tbody>
	</table>
</div><!-- BEGIN: generate_page -->
<div class="text-center">
	{PAGE}
</div><!-- END: generate_page -->
<!-- END: listnews -->
<!-- BEGIN: main -->

<div id="listnews"></div>

<script type="text/javascript">$('#listnews').load(nv_siteroot + '?' + nv_name_variable + '=' + nv_module_name + '&' + nv_fc_variable + '=detail&ajax=1&id={ROW.id}');</script>
<!-- END: main -->