Membuat NavBar Menu Dinamis
Jumpa lagi dengan saya di
andrianext.web.id, melanjutkan dari tutorial sebelumnya yaitu membuat login multi
user di codeigniter kali
ini saya akan sharing bagaimana membuat Navbar Menu yang Dinamis. kenapa di
sebut dinamis karena menu-menu yang akan di tampilkan berasal dari tabel
database yang kita buat sendiri. Sebelumnya saya anggap anda sudah memiliki
sebuah project/ folder di webserver local anda yang berisi source code
codeigniter, dan untuk source code lengkapnya anda bisa download di tutorial
saya sebelumnya/ langsung dari website resmi codeigniternya.
Dan
langsung saja kita mulai dari membuat tabel databasenya di mysql ;
Buat tabel menu dengan nama
tb_menu, disini saya menggunakan phpmyadmin untuk mempermudah management
databasenya;
CREATE TABLE IF NOT EXISTS `tb_menu` (`id_menu` int(11) NOT NULL, `nama_menu` varchar(50) NOT NULL, `icon` varchar(20) NOT NULL, `link` varchar(25) NOT NULL, `kat_menu` int(11) NOT NULL) ENGINE=InnoDB AUTO_INCREMENT=8 DEFAULT CHARSET=latin1;ALTER TABLE `tb_menu`ADD PRIMARY KEY (`id_menu`);
ALTER TABLE `tb_menu`MODIFY `id_menu` int(11) NOT NULL AUTO_INCREMENT,AUTO_INCREMENT=8;
Isi
tabelnya dengan data sample seperti beriku;
INSERT INTO `tb_menu` (`id_menu`, `nama_menu`, `icon`, `link`, `kat_menu`) VALUES(1, 'Dasboard', 'fa fa-dashboard', '#', 0),(2, 'Dasboard 1', 'fa fa-dashboard', 'dashboard', 1),(3, 'Dasboard 2', 'fa fa-dashboard', 'dashboard/2', 1),(4, 'Seting Menu', 'fa fa-gears', '#', 0),(6, 'menu admin', 'fa fa-gear', 'menu', 4),(7, 'Page', 'fa fa-folder', 'menu/page', 0);
Lakukan beberapa
config di codeigniter anda seperti beriku;
application/config/config.php
$config['base_url'] = 'http://localhost/andrianext/';
application/config/database.php
$db['default']['hostname'] = 'localhost';$db['default']['username'] = 'root';
$db['default']['password'] = '';$db['default']['database'] = 'multilogin';
$db['default']['dbdriver'] = 'mysql';
application/config/autoload.php
$autoload['libraries'] = array('database','session','form_validation','template');
$autoload['helper'] = array('url');
Selanjutnya kita
akan menampilkan tabel menu tersebut ke dalam aplikasi web kita. Dan dalam
tutorial kali ini saya menggunakan template Admin LTE yang sudah saya
integrasikan dengan codeigniter, anda bisa anda download source code yang sudah lengkap dengan template
tersebut di tutorial saya sebelumnya membuat login multi user di codeigniter.
Masuk
di application/views/template/sidebar.php
Cari dan delete code berikut :
Copykan script berikut persis di script code yang anda delete di atas;
Buka project anda
di http://localhost/andrianext/dashboard,
maka akan tampak hasilnya seperti berikut ini:
Dalam menu
sidebar di atas terlihat menu-menu yang berasal dari tabel menu yang kita buat
sebelumnya.
Ok demikian untuk
menampilkan menu dinamis dan selanjutnya kita akan membuta CRUD untuk menu dinamis
tersebut. di tutorial berikutnya.
1 comments:
makasih infonya gan, sangat bermanfaat buat pemula seperti saya ini. semoga artikel disini selalu update, senang bisa berkunjung ke situs agan
EmoticonEmoticon