![]() |
| Integrasi Template CodeIgniter dan Menampilkan Tabel Database Nortwhind |
STUDI KASUS:
1. Carilah free themes website, sebagi contoh referensi bisa Anda gunakan link berikut:
- https://shapebootstrap.net/free-templates
- https://startbootstrap.com/template-categories/all/
- https://almsaeedstudio.com/blog/10-Free-Responsive-Bootstrap-Templates-For-2016
- http://www.gettemplate.com/
- https://bootswatch.com/
- https://freewebsitetemplates.com/
- https://www.freewebtemplates.com/
- http://www.templatemonster.com/
- dan masih banyak lagi..
2. Integrasikan themes tersebut dengan framework CodeIgniter latest version
3. Tampilkan seluruh data pada tabel northwind pada themes yang Anda download.
4. Pada pertemuan 10, kumpulkan 1 lembar screenshot themes yang anda download, link download url themes, beri nim dan nama Anda untuk memastikan bahwa themes Anda unique (tidak duplikat) dengan temannya.
README >>
PENYELESAIAN:
Saya sediakan 2 metode pembelajaran, yaitu berupa video tutorial khusus bagi Anda tipikal visual learner, dan juga tulisan lengkap bagi Anda tipikal text learner (gemar membaca).
1. Download Template
Berdasarkan beberapa link rujukan tersebut, saya tertarik dengan template yang disediakan oleh situs berikut:
https://www.freewebtemplates.com/download/free-website-template/strata-961774812/
https://www.freewebtemplates.com/download/free-website-template/strata-961774812/
2. Download CodeIgniter Last Version
Last version yang saya download pada saat itu adalah versi 3.1.2, jika sampai saat ini sudah ada beberapa kali pembaruan, maka Anda bisa gunakan veri paling baru.
Silakan download disini https://www.codeigniter.com/download
Silakan download disini https://www.codeigniter.com/download
3. Kombinasikan Template dengan CodeIgniter
Extract terlebih dahulu CodeIgniter ke folder root local server Anda, kebetulan saat itu saya menggunakan wampserver, maka saya extract file tersebut ke folder wampserver → www.Setelah itu, rename folder CodeIgniter menjadi "TUGAS2" (biar lebih singkat). Berikutnya Anda buat new folder dengan nama "assets" di dalam folder root TUGAS2, kegunaan folder ini untuk menaruh file-file customization dari template yang telah kita download, seperti file *css, *js, *font, dll.
Selanjutnya extract file template dan pindahkan file-file customization ke folder assets CodeIgniter.
Kebetulan pada template yang saya download sudah tersedia folder assets dan images, maka yang perlu saya lakukan adalah copy-paste kedua folder tersebut ke folder root TUGAS2.
| Komponen Template |
| Komponen TUGAS2 (root CodeIgniter) |
4. Mengatur Konfigurasi CodeIgniter
Tahap berikutnya adalah mengatur konfigurasi CodeIgniter, kita bisa memulainya dari:4.1 Pengaturan .htaccess
Pembahasan tentang .htaccess akan diulas secara khusus pada kesempatan yang akan datang. Untuk topik kali ini, ubah saja file .htaccess Anda menjadi seperti ini:
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]
4.2 Pengaturan routes
Buka file application → config → routes
Ubah default_controller yang tadinya 'welcome' mejadi 'template'. Nama template merujuk pada nama file controller yang akan kita gunakan dalam praktikum ini.
<?php
...
$route['default_controller'] = 'template';
$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;
4.3 Pengaturan database
Buka file application → config → database
Karena kita menggunakan database northwind, jadi silakan ubah pengaturannya menjadi seperti ini:
<?php
...
$active_group = 'default';
$query_builder = TRUE;
$db['default'] = array(
'dsn' => '',
'hostname' => 'localhost',
'username' => 'root',
'password' => '',
'database' => 'northwind',
'dbdriver' => 'mysqli',
'dbprefix' => '',
4.4 Pengaturan config
Buka file application → config → config
Ubah base_url menjadi:
<?php
...
$config['base_url'] = 'http://localhost/TUGAS2';
4.5 Pengaturan autoload
Buka file application → config → autoload
Dikarenakan kita akan menampilkan record database northwind berupa tabel, maka kita perlu menggunakan beberapa library bawaan CodeIgniter seperti; table dan database.
Tidak hanya itu, kita juga perlu menggunakan beberapa helper bawaan CodeIgniter seperti; html, form, dan url.
Metode yang kita gunakan adalah memanggilnya secara otomatis via autoload, silakan atur menjadi seperti ini:
Baris 61 - libraries
<?php
...
$autoload['libraries'] = array('table','database');
Baris 92 - helper
<?php
...
$autoload['helper'] = array('html','form','url');
5. Integrasi Template
Pada tahap ini kita tinggal memainkan konsep MVC, jika Anda belum memahaminya, silakan pahami terlebih dahulu dengan cara mengikuti petunjuk praktis berikut ini:5.1 Membuat File Template Sebagai Beranda / Home
Tambahkan file Controller dengan cara duplikat file Welcome.php lalu rename menjadi "Template.php", kemudian sesuaikan penamaan class dan fungsinya.
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Template extends CI_Controller { //<-- sesuaikan nama classnya
public function index()
{
$this->load->view('My_template'); //<-- atur juga file view yang perlu dipanggil
}
}
Dikarenakan file template tidak mempunyai hubungan dengan database, maka kita tidak perlu membuat Modelnya, sehingga kita bisa melanjutkan untuk pembuatan View.
Dalam kasus ini, saya akan memecah template hasil download menjadi beberapa bagian, yaitu:
- Header.php
- Main.php
- Default_main.php
Di dalam View, tambahkan folder dengan nama "Beranda", kemudian tambahkan ketiga file diatas.
Sekarang kita perlu kembali lagi ke folder dimana kita mengekstrak template hasil download. Di sana file yang kita perlukan adalah index.html-nya, silakan buka dengan text editor masing-masing.
Copy-paste bagian ini ke Header.php
Sekarang kita perlu kembali lagi ke folder dimana kita mengekstrak template hasil download. Di sana file yang kita perlukan adalah index.html-nya, silakan buka dengan text editor masing-masing.
Pemberitahuan! Pemecahan template menjadi 3 bagian ini sudah melalui proses peninjauan sebelumnya dengan cara inspect elemen dll. (lebih jelasnya bisa Anda lihat pada video tutorialnya).
Copy-paste bagian ini ke Header.php
<!DOCTYPE HTML>
<!--
Strata by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>TUGAS 2 WDL</title> <!-- Title dirubah sesuai dengan studi kasus ->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
</head>
<body id="top">
<!-- Header -->
<header id="header">
<div class="inner">
<a href="#" class="image avatar"><img src="images/avatar.jpg" alt="" /></a>
<!--PENAMBAHAN MENU SIDEBAR / HEADER DISESUAIKAN BERDASARKAN STUDI KASUS-->
<ul>
<a href="<?php echo base_url()?>"><li>Beranda</li></a>
<a href="<?php echo base_url()?>Categories"><li>Categories</li></a>
<a href="<?php echo base_url()?>Customers"><li>Customers</li></a>
<a href="<?php echo base_url()?>Employees"><li>Employees</li></a>
<a href="<?php echo base_url()?>Orders"><li>Orders</li></a>
<a href="<?php echo base_url()?>Products"><li>Products</li></a>
<a href="<?php echo base_url()?>Shippers"><li>Shippers</li></a>
<a href="<?php echo base_url()?>Suppliers"><li>Suppliers</li></a>
</ul>
<!--END MENU-->
<!-- <h1><strong>I am Strata</strong>, a super simple<br />
responsive site template freebie<br />
crafted by <a href="http://html5up.net">HTML5 UP</a>.</h1>-->
</div>
</header>
<!-- Main -->
<div id="main">
<!-- One -->
<section id="one">
Copy-paste bagian ini ke Main.php
</section>
<!--
Ada beberapa elemen di sini yang kami hapus, dimaksudkan agar tidak mengganggu tampilan konten
tabel-tabel database northwind,
-->
</div>
<!-- Footer -->
<footer id="footer">
<div class="inner">
<ul class="icons">
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon fa-github"><span class="label">Github</span></a></li>
<li><a href="#" class="icon fa-dribbble"><span class="label">Dribbble</span></a></li>
<li><a href="#" class="icon fa-envelope-o"><span class="label">Email</span></a></li>
</ul>
<ul class="copyright">
<li>© Wawan Beneran 12131294</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>
</footer>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.poptrox.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
<script src="assets/js/main.js"></script>
</body>
</html>
Copy-paste bagian ini ke Default_main.php
<header class="major">
<h2>Ipsum lorem dolor aliquam ante commodo<br />
magna sed accumsan arcu neque.</h2>
</header>
<p>Accumsan orci faucibus id eu lorem semper. Eu ac iaculis ac nunc nisi lorem vulputate lorem neque cubilia ac in adipiscing in curae lobortis tortor primis integer massa adipiscing id nisi accumsan pellentesque commodo blandit enim arcu non at amet id arcu magna. Accumsan orci faucibus id eu lorem semper nunc nisi lorem vulputate lorem neque cubilia.</p>
<ul class="actions">
<li><a href="#" class="button">Learn More</a></li>
</ul>
</section>
<!-- Two -->
<section id="two">
<h2>Recent Work</h2>
<div class="row">
<article class="6u 12u$(xsmall) work-item">
<a href="images/fulls/01.jpg" class="image fit thumb"><img src="images/thumbs/01.jpg" alt="" /></a>
<h3>Magna sed consequat tempus</h3>
<p>Lorem ipsum dolor sit amet nisl sed nullam feugiat.</p>
</article>
<article class="6u$ 12u$(xsmall) work-item">
<a href="images/fulls/02.jpg" class="image fit thumb"><img src="images/thumbs/02.jpg" alt="" /></a>
<h3>Ultricies lacinia interdum</h3>
<p>Lorem ipsum dolor sit amet nisl sed nullam feugiat.</p>
</article>
<article class="6u 12u$(xsmall) work-item">
<a href="images/fulls/03.jpg" class="image fit thumb"><img src="images/thumbs/03.jpg" alt="" /></a>
<h3>Tortor metus commodo</h3>
<p>Lorem ipsum dolor sit amet nisl sed nullam feugiat.</p>
</article>
<article class="6u$ 12u$(xsmall) work-item">
<a href="images/fulls/04.jpg" class="image fit thumb"><img src="images/thumbs/04.jpg" alt="" /></a>
<h3>Quam neque phasellus</h3>
<p>Lorem ipsum dolor sit amet nisl sed nullam feugiat.</p>
</article>
<article class="6u 12u$(xsmall) work-item">
<a href="images/fulls/05.jpg" class="image fit thumb"><img src="images/thumbs/05.jpg" alt="" /></a>
<h3>Nunc enim commodo aliquet</h3>
<p>Lorem ipsum dolor sit amet nisl sed nullam feugiat.</p>
</article>
<article class="6u$ 12u$(xsmall) work-item">
<a href="images/fulls/06.jpg" class="image fit thumb"><img src="images/thumbs/06.jpg" alt="" /></a>
<h3>Risus ornare lacinia</h3>
<p>Lorem ipsum dolor sit amet nisl sed nullam feugiat.</p>
</article>
</div>
<ul class="actions">
<li><a href="#" class="button">Full Portfolio</a></li>
</ul>
</section>
<!-- Three -->
<section id="three">
<h2>Get In Touch</h2>
<p>Accumsan pellentesque commodo blandit enim arcu non at amet id arcu magna. Accumsan orci faucibus id eu lorem semper nunc nisi lorem vulputate lorem neque lorem ipsum dolor.</p>
<div class="row">
<div class="8u 12u$(small)">
<form method="post" action="#">
<div class="row uniform 50%">
<div class="6u 12u$(xsmall)"><input type="text" name="name" id="name" placeholder="Name" /></div>
<div class="6u$ 12u$(xsmall)"><input type="email" name="email" id="email" placeholder="Email" /></div>
<div class="12u$"><textarea name="message" id="message" placeholder="Message" rows="4"></textarea></div>
</div>
</form>
<ul class="actions">
<li><input type="submit" value="Send Message" /></li>
</ul>
</div>
<div class="4u$ 12u$(small)">
<ul class="labeled-icons">
<li>
<h3 class="icon fa-home"><span class="label">Address</span></h3>
1234 Somewhere Rd.<br />
Nashville, TN 00000<br />
United States
</li>
<li>
<h3 class="icon fa-mobile"><span class="label">Phone</span></h3>
000-000-0000
</li>
<li>
<h3 class="icon fa-envelope-o"><span class="label">Email</span></h3>
<a href="#">hello@untitled.tld</a>
</li>
</ul>
</div>
</div>
</section>
<!-- Four -->
</div>
<!-- Footer -->
<footer id="footer">
<div class="inner">
<ul class="icons">
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon fa-github"><span class="label">Github</span></a></li>
<li><a href="#" class="icon fa-dribbble"><span class="label">Dribbble</span></a></li>
<li><a href="#" class="icon fa-envelope-o"><span class="label">Email</span></a></li>
</ul>
<ul class="copyright">
<li>© Wawan 12131294</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>
</footer>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.poptrox.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
<script src="assets/js/main.js"></script>
</body>
</html>
Masih di folder View tapi diluar folder Beranda, silakan buat file php dengan nama "My_template" sebagaimana telah Anda atur pada controllernya. Kemudian tambahkan kode berikut untuk memanggil pecahan template yang diperlukan.
<?php
$this->load->view('Beranda/Header');
$this->load->view('Beranda/Default_main');
?>
SELAMAT! Sampai disini template Anda sudah terintegrasi dengan CodeIgniter. Anda bisa melakukan test dengan mengakses base URLnya: localhost/TUGAS2
![]() |
| Beranda / Home |
6. Menampilkan Tabel Database Northwind
Tahap ini prinsipnya juga masih sama sebagaimana Anda membuat halaman Template sebagai perwakilan dari Beranda. Menggunakan konsep MVC maka bisa kita mulai dari:
6.1 Menampilkan Tabel Categories
Buat file php pada controller dengan nama "Categories" dan berikut isinya:
<?php
/*
Menampilkan Tabel Categories
Oleh Wawan Beneran
gatewan.com
*/
class Categories extends CI_Controller{
public function __construct()
{
parent::__construct();
$this->load->model('Categories_model','CTM'); //cara 1.
/*
Ada 2 cara untuk memanggil model:
cara 1, diload disetiap class yang membutuhkannya. sebagaimana diatas.
cara 2, diload secara otomatis di application\config\autoload.php :
Pada line 135, Anda bisa menambahkan semacam ini:
$autoload['model'] = array('Employee_model');
jika sudah disebutkan disini, maka tidak perlu disebutkan lagi disetiap construct.
Tambahan:
$autoload['model'] = array('Employee_model'=>'em');
'Employee_model'=>'em' -> 'em' digunakan untuk menyingkat pemangilan model di class lain
*/
}
public function index(){
/*echo "<h1>Data Employees</h1>";
$query = $this->Employee_model->get_employee();
foreach($query->result() as $row):
echo $row->EmployeeID.'. '.$row->FirstName ." ".$row->LastName;
echo "<br />";
endforeach;
*/
$data["title"] = "<h1>Data Categories</h1>";
$data["array_emp"] = $this->CTM->data_categories();
$this->load->view('View_categories',$data);
}
}
?>
Dikarenakan halaman ini memiliki hubungan dengan database northwind, maka kita perlu juga membuat modelnya, silakan buat file php pada model dengan nama "Categories_model" berikut isinya:
<?php
/*
Menampilkan Tabel Categories
Oleh Wawan Beneran
gatewan.com
*/
class Categories_model extends CI_Model{
public function data_categories(){
$sql = "SELECT
c.CategoryID,
c.CategoryName,
COUNT(*) AS jumlah
FROM
categories AS c JOIN products AS p
ON c.CategoryID=p.categoryID
GROUP BY c.categoryID";
return $this->db->query($sql);
}
}
?>
Membuat file php pada View dengan nama "View_categories", berikut isinya:
<?php
/*
Menampilkan Tabel Categories
Oleh Wawan Beneran
gatewan.com
*/
$this->load->view('Beranda/Header');
echo heading($title,3);
$template = array(
'table_open' => '<table border="1" cellpadding="4" cellspacing="0">',
'table_close' => '</table>'
);
$this->table->set_template($template);
$this->table->set_heading(
'No.',
'Category Name',
'Jumlah Product');
foreach($array_emp->result() as $row):
$this->table->add_row(
$row->CategoryID,
$row->CategoryName,
$row->jumlah
);
endforeach;
echo $this->table->generate();
$this->load->view('Beranda/Main');
?>
Klik menu Categories untuk mengetahui apakah code Anda bekerja dengan baik.
![]() |
| Tampilan Categories berjalan mulus - Good job! |
Buat file controller dengan nama "Customers" berikut isinya:
<?php
/*
Menampilkan Tabel Customers
Oleh Wawan Beneran
gatewan.com
*/
class Customers extends CI_Controller{
public function __construct()
{
parent::__construct();
$this->load->model('Customers_model','CSM'); //cara 1.
}
public function index(){
$data["title"] = "<h1>Data Customers</h1>";
$data["array_emp"] = $this->CSM->get_customers();
$this->load->view('View_customers',$data);
}
}
?>
Buat file model dengan nama "Customers_model" berikut isinya:
<?php
/*
Menampilkan Tabel Customers
Oleh Wawan Beneran
gatewan.com
*/
class Customers_model extends CI_Model{
public function get_customers(){
return $this->db->get("customers"); //cara 1
}
}
?>
Buat file view dengan nama "View_customers" berikut isinya:
<?php
/*
Menampilkan Tabel Customers
Oleh Wawan Beneran
gatewan.com
*/
$this->load->view('Beranda/Header');
echo heading($title,3);
$template = array(
'table_open' => '<table border="1" cellpadding="4" cellspacing="0">',
'table_close' => '</table>'
);
$this->table->set_template($template);
$this->table->set_heading(
'ID.',
'Company Name',
'Contact Name',
'Country',
'Phone'
);
foreach($array_emp->result() as $row):
$this->table->add_row(
$row->CustomerID,
$row->CompanyName,
$row->ContactName,
$row->Country,
$row->Phone
);
endforeach;
echo $this->table->generate();
$this->load->view('Beranda/Main');
?>
Klik menu Customers untuk mengetahui hasilnya.
![]() |
| Tampilan Customers berjalan mulus - good job! |
Buat file controller dengan nama "Employees" berikut isinya:
<?php
/*
Menampilkan Tabel Employees
Oleh Wawan Beneran
gatewan.com
*/
class Employees extends CI_Controller{
public function __construct()
{
parent::__construct();
$this->load->model('Employees_model','EM'); //cara 1.
}
public function index(){
$data["title"] = "<h1>Data Employees</h1>";
$data["array_emp"] = $this->EM->get_employee();
$this->load->view('View_employees',$data);
}
}
?>
Buat file model dengan nama "Employees_model" berikut isinya:
<?php
/*
Menampilkan Tabel Employees
Oleh Wawan Beneran
gatewan.com
*/
class Employees_model extends CI_Model{
public function get_employee(){
return $this->db->get("employees"); //cara 1
}
}
?>
Buat file view dengan nama "View_employees" berikut isinya:
<?php
/*
Menampilkan Tabel Employees
Oleh Wawan Beneran
gatewan.com
*/
$this->load->view('Beranda/Header');
echo heading($title,3);
$template = array(
'table_open' => '<table border="1" cellpadding="4" cellspacing="0">',
'table_close' => '</table>'
);
$this->table->set_template($template);
$this->table->set_heading(
'No.',
'Full Name',
'Birth Date');
foreach($array_emp->result() as $row):
$this->table->add_row(
$row->EmployeeID,
$row->FirstName ." ".$row->LastName,
$row->BirthDate
);
endforeach;
echo $this->table->generate();
$this->load->view('Beranda/Main');
?>
Klik menu Empoyees untuk mengetahui hasilnya.
![]() |
| Tampilan Employees berjalan mulus - good job! |
Buat file controller dengan nama "Orders" berikut isinya:
<?php
/*
Menampilkan Tabel Orders
Oleh Wawan Beneran
gatewan.com
*/
class Orders extends CI_Controller{
public function __construct()
{
parent::__construct();
$this->load->model('Orders_model','OM'); //cara 1.
}
public function index(){
$data["title"] = "<h1>Data Orders Barang</h1>";
$data["array_emp"] = $this->OM->data_orders();
$this->load->view('View_orders',$data);
}
}
?>
Buat file model dengan nama "Orders_model" berikut isinya:
<?php
/*
Menampilkan Tabel Orders
Oleh Wawan Beneran
gatewan.com
*/
class Orders_model extends CI_Model{
public function data_orders(){
$sql = "SELECT
orders.OrderID,
orders.CustomerID,
orders.OrderDate,
orders.ShipAddress,
orders.ShipCountry,
customers.CustomerID,
customers.CompanyName
FROM orders INNER JOIN customers
ON orders.CustomerID = customers.CustomerID";
return $this->db->query($sql);
}
}
?>
Buat file view dengan nama "View_orders" berikut isinya:
<?php
/*
Menampilkan Tabel Orders
Oleh Wawan Beneran
gatewan.com
*/
$this->load->view('Beranda/Header');
echo heading($title,3);
$template = array(
'table_open' => '<table border="1" cellpadding="4" cellspacing="0">',
'table_close' => '</table>'
);
$this->table->set_template($template);
$this->table->set_heading(
'Order ID',
'Customer / Company',
'Order Date',
'Ship Address',
'Ship Country');
foreach($array_emp->result() as $row):
$this->table->add_row(
$row->OrderID,
$row->CompanyName,
$row->OrderDate,
$row->ShipAddress,
$row->ShipCountry
);
endforeach;
echo $this->table->generate();
$this->load->view('Beranda/Main');
?>
Klik menu Orders untuk mengetahui hasilnya.
![]() |
| Tampilan Orders berjalan mulus - good job! |
Buat file controller dengan nama "Products" berikut isinya:
<?php
/*
Menampilkan Tabel Products
Oleh Wawan Beneran
gatewan.com
*/
class Products extends CI_Controller{
public function __construct()
{
parent::__construct();
$this->load->model('Products_model','PM'); //cara 1.
}
public function index(){
$data["title"] = "<h1>Data Products</h1>";
$data["array_emp"] = $this->PM->get_products();
$this->load->view('View_products',$data);
}
}
?>
Buat file model dengan nama "Products_model" berikut isinya:
<?php
/*
Menampilkan Tabel Products
Oleh Wawan Beneran
gatewan.com
*/
class Products_model extends CI_Model{
public function get_products(){
return $this->db->get("products"); //cara 1
}
}
?>
Buat file view dengan nama "View_products" berikut isinya:
<?php
/*
Menampilkan Tabel Products
Oleh Wawan Beneran
gatewan.com
*/
$this->load->view('Beranda/Header');
echo heading($title,3);
$template = array(
'table_open' => '<table border="1" cellpadding="4" cellspacing="0">',
'table_close' => '</table>'
);
$this->table->set_template($template);
$this->table->set_heading(
'Product ID',
'Product Name',
'Quantity Per Unit',
'Stock');
foreach($array_emp->result() as $row):
$this->table->add_row(
$row->ProductID,
$row->ProductName,
$row->QuantityPerUnit,
$row->UnitsInStock
);
endforeach;
echo $this->table->generate();
$this->load->view('Beranda/Main');
?>
Klik menu Products untuk mengetahui hasilnya.
![]() |
| Tampilan Products berjalan mulus - good job! |
Buat file controller dengan nama "Shippers" berikut isinya:
<?php
/*
Menampilkan Tabel Shippers
Oleh Wawan Beneran
gatewan.com
*/
class Shippers extends CI_Controller{
public function __construct()
{
parent::__construct();
$this->load->model('Shippers_model','SM'); //cara 1.
}
public function index(){
$data["title"] = "<h1>Data Shippers</h1>";
$data["array_emp"] = $this->SM->get_shippers();
$this->load->view('View_shippers',$data);
}
}
?>
Buat file model dengan nama "Shippers_model" berikut isinya:
<?php
/*
Menampilkan Tabel Shippers
Oleh Wawan Beneran
gatewan.com
*/
class Shippers_model extends CI_Model{
public function get_shippers(){
return $this->db->get("shippers"); //cara 1
}
}
?>
Buat file view dengan nama "View_shippers" berikut isinya:
<?php
/*
Menampilkan Tabel Shippers
Oleh Wawan Beneran
gatewan.com
*/
$this->load->view('Beranda/Header');
echo heading($title,3);
$template = array(
'table_open' => '<table border="1" cellpadding="4" cellspacing="0">',
'table_close' => '</table>'
);
$this->table->set_template($template);
$this->table->set_heading(
'Shipper ID',
'Company Name',
'Phone');
foreach($array_emp->result() as $row):
$this->table->add_row(
$row->ShipperID,
$row->CompanyName,
$row->Phone
);
endforeach;
echo $this->table->generate();
$this->load->view('Beranda/Main');
?>
Klik menu Shippers untuk mengetahui hasilnya.
![]() |
| Tampilan Shippers berjalan mulus - good job! |
Buat file controller dengan nama "Suppliers" berikut isinya:
<?php
/*
Menampilkan Tabel Suppliers
Oleh Wawan Beneran
gatewan.com
*/
class Suppliers extends CI_Controller{
public function __construct()
{
parent::__construct();
$this->load->model('Suppliers_model','SM'); //cara 1.
}
public function index(){
$data["title"] = "<h1>Data Suppliers</h1>";
$data["array_emp"] = $this->SM->get_suppliers();
$this->load->view('View_suppliers',$data);
}
}
?>
Buat file model dengan nama "Suppliers_model" berikut isinya:
<?php
/*
Menampilkan Tabel Suppliers
Oleh Wawan Beneran
gatewan.com
*/
class Suppliers_model extends CI_Model{
public function get_suppliers(){
return $this->db->get("suppliers"); //cara 1
}
}
?>
Buat file view dengan nama "View_suppliers" berikut isinya:
<?php
/*
Menampilkan Tabel Suppliers
Oleh Wawan Beneran
gatewan.com
*/
$this->load->view('Beranda/Header');
echo heading($title,3);
$template = array(
'table_open' => '<table border="1" cellpadding="4" cellspacing="0">',
'table_close' => '</table>'
);
$this->table->set_template($template);
$this->table->set_heading(
'Supplier ID',
'Company Name',
'Address',
'City',
'Country',
'Phone');
foreach($array_emp->result() as $row):
$this->table->add_row(
$row->SupplierID,
$row->CompanyName,
$row->Address,
$row->City,
$row->Country,
$row->Phone
);
endforeach;
echo $this->table->generate();
$this->load->view('Beranda/Main');
?>
Klik menu Suppliers untuk mengetahui hasilnya.
![]() |
| Tampilan Suppliers berjalan mulus - good job! |
Mission Completed!









Hii Fajar,
BalasHapusDatabasenya bisa download DISINI gan. selamat belajar!