Dalam CodeIgniter 4 pagination dengan bootstrap 4 contoh tutorial ini. Di sini Anda akan belajar bagaimana menggunakan pagination dengan tabel bootstrap 4 dalam framework codeigniter 4
Pada contoh pagination CodeIgniter 4 dengan Bootstrap 4 ini, kita akan membuat tabel dan menampilkan daftar pengguna dengan pagination pada project codeigniter 4.
CodeIgniter 4 Tutorial Contoh Pagination
Ikuti langkah-langkah di bawah ini, buat daftar dengan tabel bootstrap 4 menggunakan codeigniter 4 pagination:
Daftar Isi
Langkah 1: Unduh Proyek Codeigniter
Pada langkah ini, kami akan mengunduh versi terbaru Codeigniter 4, Buka tautan ini https://codeigniter.com/download Unduh Codeigniter 4 penyiapan baru dan unzip pengaturan di sistem lokal Anda xampp / htdocs /. Dan ubah nama folder unduhan "demo"
Langkah 2: Konfigurasi Dasar
Selanjutnya, kita akan mengatur beberapa konfigurasi dasar pada file app/config/app.php , jadi mari kita pergi ke application/config/config.php dan buka file ini pada editor teks.
Tetapkan URL Dasar seperti ini
public $baseURL = 'http://localhost:8080';
To
public $baseURL = 'http://localhost/demo/';Langkah 3: Buat Database Dengan Tabel
Pada langkah ini, kita perlu membuat demo nama database, jadi buka PHPMyAdmin Anda dan buat database dengan nama demo. Setelah berhasil membuat database, Anda dapat menggunakan kueri SQL di bawah ini untuk membuat tabel di database Anda.
CREATE TABLE users (
id int(11) NOT NULL AUTO_INCREMENT COMMENT 'Primary Key',
name varchar(100) NOT NULL COMMENT 'Name',
email varchar(255) NOT NULL COMMENT 'Email Address',
contact_no varchar(50) NOT NULL COMMENT 'Contact No',
created_at varchar(20) NOT NULL COMMENT 'Created date',
PRIMARY KEY (id)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 COMMENT='datatable demo table' AUTO_INCREMENT=1;
INSERT INTO users(id, name, email, mobile_number, created_at) VALUES
(1, 'Team', '[email protected]', '9000000001', '2019-01-01'),
(2, 'Admin', '[email protected]', '9000000002', '2019-01-02'),
(3, 'User', '[email protected]', '9000000003', '2019-01-03'),
(4, 'Editor', '[email protected]', '9000000004', '2019-01-04'),
(5, 'Writer', '[email protected]', '9000000005', '2019-01-05'),
(6, 'Contact', '[email protected]', '9000000006', '2019-01-06'),
(7, 'Manager', '[email protected]', '9000000007', '2019-01-07'),
(8, 'John', '[email protected]', '9000000055', '2019-01-08'),
(9, 'Merry', '[email protected]', '9000000088', '2019-01-09'),
(10, 'Keliv', '[email protected]', '9000550088', '2019-01-10'),
(11, 'Herry', '[email protected]', '9050550088', '2019-01-11'),
(12, 'Mark', '[email protected]', '9050550998', '2019-01-12');Langkah 4: Siapkan Kredensial Database
Pada langkah ini, kita perlu menghubungkan proyek kita ke database. kita perlu membuka app/Config/Database.php dan membuka file database.php di editor teks. Setelah membuka file di editor teks, Kami perlu menyiapkan kredensial database di file ini seperti di bawah ini.
public $default = [
'DSN' => '',
'hostname' => 'localhost',
'username' => 'root',
'password' => '',
'database' => 'demo',
'DBDriver' => 'MySQLi',
'DBPrefix' => '',
'pConnect' => false,
'DBDebug' => (ENVIRONMENT !== 'production'),
'cacheOn' => false,
'cacheDir' => '',
'charset' => 'utf8',
'DBCollat' => 'utf8_general_ci',
'swapPre' => '',
'encrypt' => false,
'compress' => false,
'strictOn' => false,
'failover' => [],
'port' => 3306,
];Langkah 5: Buat Model dan Controller
Jadi buka app/Models/ dan buat satu model di sini. Dan Anda perlu membuat satu nama model contactModel.php dan memperbarui kode berikut ke dalam file contactModel.php Anda:
<?php namespace App\Models;
use CodeIgniter\Database\ConnectionInterface;
use CodeIgniter\Model;
class UserModel extends Model
{
protected $table = 'contacts';
protected $allowedFields = ['name', 'email'];
}Buat Controller
Sekarang Pergi ke app/Controllers dan buat nama controller Users.php. Pada controller ini, kita akan membuat beberapa metode/fungsi. Kami akan membangun beberapa metode seperti:
- Index() - Ini digunakan untuk menampilkan daftar users dengan pagination.
<?php namespace App\Controllers;
use CodeIgniter\Controller;
use App\Models\UserModel;
class Users extends Controller
{
public function index()
{
$model = new UserModel();
$data = [
'users' => $model->paginate(10),
'pager' => $model->pager
];
return view('users', $data);
}
}Langkah 6: Buat View
Sekarang kita perlu membuat users.php , masuk ke folder application/views/ dan buat file users.php. dan perbarui HTML berikut ke dalam file Anda :.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Codeigniter 4 Pagination Example - Medikre.com</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="container">
<div class="row mt-5">
<table class="table table-bordered">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<?php if($users): ?>
<?php foreach($users as $user): ?>
<tr>
<td><?php echo $user['id']; ?></td>
<td><?php echo $user['name']; ?></td>
<td><?php echo $user['email']; ?></td>
</tr>
<?php endforeach; ?>
<?php endif; ?>
</tbody>
</table>
<div class="row">
<div class="col-md-12">
<div class="row">
<?php if ($pager) :?>
<?php $pagi_path='demo/public/index.php/users'; ?>
<?php $pager->setPath($pagi_path); ?>
<?= $pager->links() ?>
<?php endif ?>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>Langkah 7: Start Development server
Untuk memulai pengembangan server, Pergi ke browser dan tekan di bawah URL.
http://localhost/demo/public/index.php/usersKesimpulan
Dalam tutorial contoh halaman Codeigniter 4 dengan Bootstrap 4 ini, Kami telah berhasil membuat tabel menggunakan boostrap 4 dan menampilkan data dengan pagination di project codeigniter 4.
turorial codeigniter codeigniter
andriajah