Membuat menu multi level dengan php

Irnanto.com –  Kita Pasti sering membuat penomoran multilevel seperti sub bab, sub menu atau daftar isi pada aplikasi pengolah kata seperti microsoft word, tapi bagaimana jika kita ingin membuat atau menampilkan data daftar list dari database sesuai dengan multilevel penomorannya masing-masing ?.

Kita sering memiliki data berupa list dalam database, tetapi setiap list data tersebut memiliki posisi atau tingkatan hirarki atau multilevel data list yang berbeda-beda. Di beberapa sistem informasi, banyak data yang harus ditampilkan berupa hirarki atau tingkatan. Seorang developer memerlukan sebuah algoritma yang dapat menyusun list sesuai dengan hirarki atau tingkatan data list tersebut.

Pembuatan daftar list yang disesuaikan dengan tingkatan level data list tersebut dapat berupa tree menu atau data tree dan penomoran multi level. Penomoran multilevel sering digunakan untuk membuat sub menu atau sub sub daftar list, sedangkan tree menu atau data tree sering digunakan untuk membuat pengelompokan dari sebuah bagian menu/data yang digambarkan dengan garis penghubung parent dan child.

Kali ini kita akan mencoba menampilkan data list pada database yang masih acak untuk di generate urutannya sesuai posisi tingkatan level data list tersebut.

Cara Membuat Penomoran Sub Menu Multilevel Dengan PHP

Pertama yang harus kita persiapkan untuk menampilkan penomoran data list sesuai dengan levelnya ialah database dan tabel yang telah diisi datanya, untuk membuat operasi CRUD (Create Read Update Delete) menggunakan PHP akan saya jelaskan di artikel selanjutnya. Saat ini Anda siapkan dulu database dan tabel sesuai dengan gambar di bawah ini.

Buatlah database “db_instansi” dan tabel “menu” (Anda bisa mengganti nama database dan tabel sesuai keinginan). Kita menggunakan database MySQL untuk latihan kali ini, jika Anda menggunakan databe lain, silahkan sesuaikan source kode untuk proses koneksi dan pemilihan tabelnya.

Struktur Tabel Menu

Keterangan : 

• Field (id_menu, nama_menu, parent, urut)
• Primary key (id_menu)
• id_menu auto increment
• id_menu merupakan primary key yang menjadi patokan utama
• nama_menu diisi nama menu yang akan ditampilkan
• parent diisi id_menu induk
• urut merupakan urutan dari satu kelompok tingkatan

Setelah membuat database data tabel, isikan data pada tabel menu seperti gambar di bawah ini. Sebenarnya data yang Anda isikan bisa Anda rubah sesuai keinginan Anda, tetapi kita harus memperhatikan field parent dan urut untuk menentukan level dan urutan penampilannya.

Data List Menu dan Sub Menu Multilevel

Setelah database, tabel, dan datanya telah siap, maka kita buat script PHP yang akan menampilkan data pada tabel menu tetapi sebelum ditampilkan, data tersebut harus diurutkan dulu, agar sesuai dengan posisi dan tingkatan level atau sub bagian menu induk.

Script Menampilkan Penomoran Menu Multilevel

Ketikkan script di bawah ini dan simpan sebagai file php

<?php
mysql_connect(“localhost”,”root”,””);
mysql_select_db(“db_instansi”);

function get_menu($data, $parent = 0,$urut=””) {
    if (isset($data[$parent])) {
        $html = “”;
        foreach ($data[$parent] as $v) {
            $urutku=$urut .$v->urut.”.”;
            $child = get_menu($data, $v->id_menu, $urutku);
            $html .= $urutku .” “;
            $html .= $v->nama_menu.'<br/>’;
            if ($child) {
                $html .= $child;
            }
        }
        return $html;
    } else {
        return false;
    }
}

$result = mysql_query(“SELECT * FROM menu ORDER BY urut”);
while ($row = mysql_fetch_object($result)) {
    $data[$row->parent][] = $row;
}
$menu = get_menu($data);
echo “$menu”;
?>

Keterangan script PHP menampilkan penomoran multilevel :

• Beris ke dua, membuat koneksi ke database
• Baris ke tiga, memilih nama database
• Baris ke lima, membuat fungsi untuk menentukan posisi/level list dan urutannya
• Baris ke enam, mengecek apakah $data[$parent] sudah di set atau belum, jika belum makan akan mengembalikan data false (baris ke sembilan belas) dan jika benar maka akan mengembalikan data dari variabel $html (baris ke tujuh belas)
• Baris ke tujuh, membuat variabel $html dengan data string “” (kosong)
• Baris ke delapan, melakukan perulangan untuk data $data[$parent]
• Baris ke sembilan, mengisikan variabel $urutku dengan data $urut  digabung dengan $v->urut dan digabung dengan karakter titik “.”
• Baris ke sepuluh, memanggil fungsi get_menu dengan parameter $data, $v->id_menu, dan $urutku untuk menentukan child atau anak dari list yang bersangkutan
• Baris ke sebelas, menambahkan variabel $urutku dan karakter spasi ” “ ke dalam variabel $html
• Baris ke dua belas, menambahkan data $v->nama_menu dan karakter ‘<br/>’ ke dalam variabel $html
• Baris ke tiga belas, menentukan jika variabel $child bernilai true maka variabel $child akan ditambahkan ke variabel $html
• Baris ke dua puluh tiga, membuat pemanggilan query dengan perintah menampilkan seluruh data pada tabel menu dengan mengurutkan berdasarkan filed / kolom urut
• Baris ke dua puluh empat, melakukan perulangan sebanyak data yang ditangkap dari eksekusi query dari variabel $result dan di simpan di dalam variabel $row
• Baris ke dua puluh lima, mengisi data variabel array $data[$row->parent][] dengan data hasil penangkapan eksekusi query (variabel $row)
• Baris dua puluh tujuh, memanggil fungsi get_menu dengan parameter yang dikirimkan berupa variabel $data
• Baris dua puluh delapan, menampilkan data variabel $menu

Sekarang coba jalankan dan lihat hasilnya, jika sukses maka hasil tampilannya akan seperti gambar dibawah ini

Hasil Output PHP Penomoran Multilevel

Anda bisa berkreasi untuk menghasilkan tampilan yang menarik dengan menggunakan HTML dan CSS . Sampai disini dulu pembahasan mengenai Cara Membuat Penomoran Multilevel Daftar List , kita akan melanjutkannya dengan pembahasan lainnya untuk operasi create, update, delete, dan pengaturan posisi list di artikel selanjutnya. Tetap Kunjungi terus irnanto.com untuk mendapat update artikel terbarunya yaa