Fungsi Php Dan Javascript Untuk Navigasi Halaman Angka

Berikut ini ialah fungsi navigasi halaman angka yang paling standar dan paling sesuai untuk diterapkan pada semua kasus. Saya sediakan dalam bahasa JavaScript dan PHP, alasannya ialah berdasarkan Saya tampilan navigasi ini sangat sederhana namun sudah meliputi semua fitur yang ada. Yaitu fitur navigasi halaman Awal, Akhir, Berikutnya, Sebelumnya, dan navigasi halaman angka yang memungkinkan kita untuk melompati beberapa halaman sekaligus.

JavaScript

function pager(current, count, chunk, kin, fn, first, previous, next, last) {     var begin = 1,         end = Math.ceil(count / chunk),         s = "",         i, min, max;     if (end <= 1) {         return s;     }     if (current <= kin + kin) {         min = begin;         max = Math.min(begin + kin + kin, end);     } else if (current > end - kin - kin) {         min = end - kin - kin;         max = end;     } else {         min = current - kin;         max = current + kin;     }     if (previous) {         s = '<span>';         if (current === begin) {             s += '<b title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka">' + previous + '</b>';         } else {             s += '<a href="' + fn(current - 1) + '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="prev">' + previous + '</a>';         }         s += '</span> ';     }     if (first && last) {         s += '<span>';         if (min > begin) {             s += '<a href="' + fn(begin) + '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="prev">' + begin + '</a>';             if (min > begin + 1) {                 s += ' <span>&hellip;</span>';             }         }         for (i = min; i <= max; ++i) {             if (current === i) {                 s += ' <b title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka">' + i + '</b>';             } else {                 s += ' <a href="' + fn(i) + '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="' + (current >= i ? 'prev' : 'next') + '">' + i + '</a>';             }         }         if (max < end) {             if (max < end - 1) {                 s += ' <span>&hellip;</span>';             }             s += ' <a href="' + fn(end) + '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="next">' + end + '</a>';         }         s += '</span>';     }     if (next) {         s += ' <span>';         if (current === end) {             s += '<b title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka">' + next + '</b>';         } else {             s += '<a href="' + fn(current + 1) + '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="next">' + next + '</a>';         }         s += '</span>';     }     return s; }

PHP

function pager($current, $count, $chunk, $kin, $fn, $first, $previous, $next, $last) {     $begin = 1;     $end = (int) ceil($count / $chunk);     $s = "";     if ($end <= 1) {         return $s;     }     if ($current <= $kin + $kin) {         $min = $begin;         $max = min($begin + $kin + $kin, $end);     } else if ($current > $end - $kin - $kin) {         $min = $end - $kin - $kin;         $max = $end;     } else {         $min = $current - $kin;         $max = $current + $kin;     }     if ($previous) {         $s = '<span>';         if ($current === $begin) {             $s .= '<b title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka">' . $previous . '</b>';         } else {             $s .= '<a href="' . call_user_func($fn, $current - 1) . '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="prev">' . $previous . '</a>';         }         $s .= '</span> ';     }     if ($first && $last) {         $s .= '<span>';         if ($min > $begin) {             $s .= '<a href="' . call_user_func($fn, $begin) . '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="prev">' . $begin . '</a>';             if ($min > $begin + 1) {                 $s .= ' <span>&hellip;</span>';             }         }         for ($i = $min; $i <= $max; ++$i) {             if ($current === $i) {                 $s .= ' <b title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka">' . $i . '</b>';             } else {                 $s .= ' <a href="' . call_user_func($fn, $i) . '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="' . ($current >= $i ? 'prev' : 'next') . '">' . $i . '</a>';             }         }         if ($max < $end) {             if ($max < $end - 1) {                 $s .= ' <span>&hellip;</span>';             }             $s .= ' <a href="' . call_user_func($fn, $end) . '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="next">' . $end . '</a>';         }         $s .= '</span>';     }     if ($next) {         $s .= ' <span>';         if ($current === $end) {             $s .= '<b title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka">' . $next . '</b>';         } else {             $s .= '<a href="' . call_user_func($fn, $current + 1) . '" title="Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka" rel="next">' . $next . '</a>';         }         $s .= '</span>';     }     return $s; }

Tentukan nomor halaman ketika ini (dimulai dari angka 1), pada current, jumlah total data pada count, jumlah data yang ingin ditampilkan per halaman pada chunk, jumlah navigasi angka yang perlu ditampilkan sebelum dan setelah angka halaman yang aktif pada kin, fungsi untuk menciptakan tautan pada fn dan teks untuk masing-masing tautan navigasi pada first, previous, next dan last.

Contoh

JavaScript

container.innerHTML = '<nav>' + pager(1, 500, 10, 2, function(i) {     return i === 1 ? '/article' : '/article/' + i; }, 'Awal', 'Sebelumya', 'Berikutnya', 'Akhir') + '</nav>';

PHP

echo '<nav>' . pager(1, 500, 10, 2, function($i) {     return $i === 1 ? '/article' : '/article/' . $i; }, 'Awal', 'Sebelumya', 'Berikutnya', 'Akhir') . '</nav>';

Referensi: StackOverflow Like Pagination

Sumber https://www.dte.web.id/