membuat pagging dengan CodeIgniter

http://www.carikode.com/tutorial-codeigniter-cara-mudah-membuat-pagination-dengan-codeigniter/
http://www.dumetschool.com/blog/Membuat-Paging-di-Codeigniter#

Assalamualaikum ..

sebelum nya saya akan menjelaskan dulu sedikit apa itu pagination, karena mungkin ada teman-teman yang belum mengenal istilah ini . pagination adalah pengelompokan data record yang di kelompokkan dengan cara di pisahkan menjadi beberapa halaman . dan jumlah halaman tergantung dari semua jumlah record dan berapa record yang ingin di tampilkan per halamanannya . dengan kata lain rumus nya adalah ” jumlah_halaman = jumlah_record / record_yang_ditampilkan “.

mungkin bagi teman-teman yang baru saja mulai belajar framework codeigniter mungkin agak bingung dengan cara membuat paging pada codeigniter . untuk tutorial membuat paging dengan php kita sudah bahas pada sub tutorial php sebelumnya. klik di sini untuk melihat tutorial membuat paging dengan php di carikode.com

tutorial membuat paging dengan PHP

oke langsung saja ya teman-teman sekalian kita mulai cara mudah membuat paging atau pagination dengan codeigniter .

Persiapan

yang pertama kali harus kita lakukan adalah men-load dulu library pagination pada codeigniter. di sini saya men-load library pagination,database dan table . saya juga men-load helper html dan url .

untuk membuat pagination kita membutuhkan helper url untuk membuat hyperlink , helper html untuk menggunakan fungsi html pada codeigniter. karena di sini saya menggunakan beberapa fungsi html di codeigniter . library database harus di aktifkan atau harus di load juga karena kita menggunakan database. karena record data yang kita ambil adalah record data dari database .dan yang paling penting lainnya adalah library pagination . karena library pagination adalah library wajib untuk membuat paging di codeigniter .

application/config/autoload.php

1

2

3

$autoload['libraries'] = array('pagination','database','table');

$autoload['helper'] = array('html','url');

selanjut nya setting base_url projek ci kita

berhubung nama projek ci saya adalah carikode_paging maka

application/config/config.php

1

$config['base_url'] = 'http://localhost/carikode_paging/';

oke .. untuk settingan ci nya selesai . nanti sesuaikan aja sama settingan projek teman-teman .

Database

setting database

application/config/database.php

tinggal di sesuaikan aja

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

$db['default']['hostname'] = 'localhost';

$db['default']['username'] = 'root';

$db['default']['password'] = 'xxx';

$db['default']['database'] = 'ck_paging';

$db['default']['dbdriver'] = 'mysql';

$db['default']['dbprefix'] = '';

$db['default']['pconnect'] = TRUE;

$db['default']['db_debug'] = TRUE;

$db['default']['cache_on'] = FALSE;

$db['default']['cachedir'] = '';

$db['default']['char_set'] = 'utf8';

$db['default']['dbcollat'] = 'utf8_general_ci';

$db['default']['swap_pre'] = '';

$db['default']['autoinit'] = TRUE;

$db['default']['stricton'] = FALSE;

kemudian buat sebuah database, di sini saya buat database dengan nama ck_paging . dan buat table artikel

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

-- phpMyAdmin SQL Dump

-- version 3.4.10.1deb1

-- http://www.phpmyadmin.net

--

-- Host: localhost

-- Generation Time: Mar 16, 2015 at 10:41 AM

-- Server version: 5.5.40

-- PHP Version: 5.3.10-1ubuntu3.15

SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";

SET time_zone = "+00:00";

/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;

/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;

/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;

/*!40101 SET NAMES utf8 */;

--

-- Database: `ck_paging`

--

-- --------------------------------------------------------

--

-- Table structure for table `artikel`

--

CREATE TABLE IF NOT EXISTS `artikel` (

  `id` int(11) NOT NULL AUTO_INCREMENT,

  `artikel` varchar(255) NOT NULL,

  PRIMARY KEY (`id`)

) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=74 ;

--

-- Dumping data for table `artikel`

--

INSERT INTO `artikel` (`id`, `artikel`) VALUES

(1, 'typesetting industry. Lorem Ipsum has been '),

(2, 'Lorem Ipsum is simply dummy text of the printing'),

(3, 'standard dummy text ever since the 1500s'),

(4, 'when an unknown printer took a galley of type '),

(5, 'when an unknown printer took a galley'),

(6, 'scrambled it to make a type specimen book'),

(7, 'It has survived not only five centuries'),

(8, 'but also the leap into electronic typesetting'),

(9, 'remaining essentially unchanged.'),

(10, 'It was popularised in the 1960s with the release'),

(11, 'Letraset sheets containing Lorem Ipsum passages'),

(12, 'desktop publishing software like Aldus PageMaker '),

(13, 'but also the leap into electronic typesetting'),

(14, 'including versions of Lorem Ipsum'),

(15, 'It is a long established fact that a reader'),

(16, 'but also the leap into electronic typesetting'),

(17, 'will be distracted by the readable content of a page'),

(18, 'Content here, content here, making it look'),

(19, 'It was popularised in the 1960s with the release'),

(20, 'Letraset sheets containing Lorem Ipsum passages'),

(21, 'desktop publishing software like Aldus PageMaker '),

(22, 'but also the leap into electronic typesetting'),

(23, 'including versions of Lorem Ipsum'),

(24, 'It is a long established fact that a reader'),

(25, 'but also the leap into electronic typesetting'),

(26, 'will be distracted by the readable content of a page'),

(27, 'Content here, content here, making it look'),

(28, 'It was popularised in the 1960s with the release'),

(29, 'Letraset sheets containing Lorem Ipsum passages'),

(30, 'desktop publishing software like Aldus PageMaker '),

(31, 'but also the leap into electronic typesetting'),

(32, 'including versions of Lorem Ipsum'),

(33, 'It is a long established fact that a reader'),

(34, 'but also the leap into electronic typesetting'),

(35, 'will be distracted by the readable content of a page'),

(36, 'Content here, content here, making it look'),

(37, 'It was popularised in the 1960s with the release'),

(38, 'Letraset sheets containing Lorem Ipsum passages'),

(39, 'desktop publishing software like Aldus PageMaker '),

(40, 'but also the leap into electronic typesetting'),

(41, 'including versions of Lorem Ipsum'),

(42, 'It is a long established fact that a reader'),

(43, 'but also the leap into electronic typesetting'),

(44, 'will be distracted by the readable content of a page'),

(45, 'Content here, content here, making it look'),

(46, 'It was popularised in the 1960s with the release'),

(47, 'Letraset sheets containing Lorem Ipsum passages'),

(48, 'desktop publishing software like Aldus PageMaker '),

(49, 'but also the leap into electronic typesetting'),

(50, 'including versions of Lorem Ipsum'),

(51, 'It is a long established fact that a reader'),

(52, 'but also the leap into electronic typesetting'),

(53, 'will be distracted by the readable content of a page'),

(54, 'Content here, content here, making it look'),

(55, 'It was popularised in the 1960s with the release'),

(56, 'Letraset sheets containing Lorem Ipsum passages'),

(57, 'desktop publishing software like Aldus PageMaker '),

(58, 'but also the leap into electronic typesetting'),

(59, 'including versions of Lorem Ipsum'),

(60, 'It is a long established fact that a reader'),

(61, 'but also the leap into electronic typesetting'),

(62, 'will be distracted by the readable content of a page'),

(63, 'Content here, content here, making it look'),

(64, 'It was popularised in the 1960s with the release'),

(65, 'Letraset sheets containing Lorem Ipsum passages'),

(66, 'desktop publishing software like Aldus PageMaker '),

(67, 'but also the leap into electronic typesetting'),

(68, 'including versions of Lorem Ipsum'),

(69, 'It is a long established fact that a reader'),

(70, 'but also the leap into electronic typesetting'),

(71, 'will be distracted by the readable content of a page'),

(72, 'Content here, content here, making it look'),

(73, 'remaining essentially unchanged');

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;

/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;

/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

pada table artikel ini saya sudah mengisi 73 record data untuk contoh pagination dengan codeigniter kita .. hehe

lanjut ….

Membuat Pagination

kemudian buat sebuah controller . di tutorial ini saya menggunakan controller welcome.php

application/controllers/welcome.php

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Welcome extends CI_Controller {

 function __construct(){

  parent::__construct();

  $this->load->model('m_artikel');

 }

 function index(){

  $jumlah= $this->m_artikel->jumlah();

  $config['base_url'] = base_url().'index.php/welcome/index/';

  $config['total_rows'] = $jumlah;

  $config['per_page'] = 10;   

  $dari = $this->uri->segment('3');

  $data['artikel'] = $this->m_artikel->lihat($config['per_page'],$dari);

  $this->pagination->initialize($config); 

  $this->load->view('v_welcome',$data);

 }

}

pada fungsi __construct() kita load dulu model yang akan kita gunakan . di sini saya membuat sebuah model dengan nama m_artikel.php ( sebentar lagi kita buat )

1

$this->load->model('m_artikel');

perhatikan pada fungsi index . untuk settingan wajib pagination dasar pada codeigniter

1

2

3

4

5

6

  $config['base_url'] = base_url().'index.php/welcome/index/';

  $config['total_rows'] = $jumlah;

  $config['per_page'] = 10;   

  $dari = $this->uri->segment('3');

  $data['artikel'] = $this->m_artikel->lihat($config['per_page'],$dari);

  $this->pagination->initialize($config);

base url nya kita isi dengan url paging . total_row nya isi dengan variabel jumlah . apa isi variabel jumlah ? isi nya adalah jumlah record .

1

$jumlah= $this->m_artikel->jumlah();

pada per_page isi dengan jumlah record yang ingin kita tampilkan perhalaman nya

variabel dari berisi dengan id record yang kita jadikan sebagai urutan awal record yang kita tampilkan .

cara mudah membuat pagination dengan codeigniter

kemudian

application/models/m_artikel.php

1

2

3

4

5

6

7

8

9

10

11

12

13

<?php

class M_artikel extends CI_Model{

 function lihat($sampai,$dari){

  return $query = $this->db->get('artikel',$sampai,$dari)->result();

 }

 function jumlah(){

  return $this->db->get('artikel')->num_rows();

 }

}

pada model m_artikel ini pada fungsi lihat kita tangkap data yang kita kirim dari controller welcome tadi . untuk mengatur offset dan limit record yang di tampilkan .

pada fungsi jumlah kita mengambil data jumlah semua record .

dan terakhir buat sebuah view dengan nama v_welcome.php

application/views/v_welcome.php

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

<!DOCTYPE html>

<html lang="en">

<head>

 <title>CARIKODE</title>

</head>

<body>

 <?php 

 echo heading('TUTORIAL PAGING CODEIGNITER | CARIKODE.COM',1);

 echo $this->pagination->create_links();

 $this->table->set_heading(array('id', 'Artikel'));

 foreach($artikel as $a){ 

  $this->table->add_row(array($a->id, $a->artikel,));

 }

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

 ?>

</body>

</html>

nah. jangan lupa

1

echo $this->pagination->create_links();

yang berguna untuk membuat link paging nya .

sekarang setelah semuanya selesai langsung saja kita coba

Tutorial CodeIgniter : Cara mudah membuat pagination dengan CodeIgniter

nah . selesai sudah cara mudah membuat pagination dengan codeigniter . sekian dulu Tutorial CodeIgniter : Cara mudah membuat pagination dengan CodeIgniter . sampai jumpa di tutorial berikutnya. semoga dapat bermanfaat..

tambhin css nya :
// CSS Bootstrap
$config['full_tag_open'] = '<ul class="pagination" style="float: right">';
$config['full_tag_close'] = '</ul>';
$config['prev_link'] = '«';
$config['prev_tag_open'] = '<li>';
$config['prev_tag_close'] = '</li>';
$config['next_link'] = '»';
$config['next_tag_open'] = '<li>';
$config['next_tag_close'] = '</li>';
$config['cur_tag_open'] = '<li class="active"><a href="">';
$config['cur_tag_close'] = '</a></li>';
$config['num_tag_open'] = '<li>';
$config['num_tag_close'] = '</li>';
// Akhir CSS

application/controllers/welcome.php

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Welcome extends CI_Controller {

 function __construct(){

  parent::__construct();

  $this->load->model('m_artikel');

 }

 function index(){

  $jumlah= $this->m_artikel->jumlah();

  $config['base_url'] = base_url().'index.php/welcome/index/';

  $config['total_rows'] = $jumlah;

  $config['per_page'] = 10;   

   // CSS Bootstrap               

  $config['full_tag_open'] = '<ul class="pagination" style="float: right">';

  $config['full_tag_close'] = '</ul>';            

  $config['prev_link'] = '«';

  $config['prev_tag_open'] = '<li>';

  $config['prev_tag_close'] = '</li>';

  $config['next_link'] = '»';

  $config['next_tag_open'] = '<li>';

  $config['next_tag_close'] = '</li>';

  $config['cur_tag_open'] = '<li class="active"><a href="">';

  $config['cur_tag_close'] = '</a></li>';

  $config['num_tag_open'] = '<li>';

  $config['num_tag_close'] = '</li>';

                // Akhir CSS

  $dari = $this->uri->segment('3');

  $data['artikel'] = $this->m_artikel->lihat($config['per_page'],$dari);

  $this->pagination->initialize($config); 

  $this->load->view('v_welcome',$data);

 }

}