Tạo menu đa cấp, multi-level menu đệ quy trong PHP

10 thg 9, 2013

Trong một website có lẽ sẽ không bao giờ không có menu, tùy vào mục đích thiết kế và ý tưởng mà menu được thể hiện khác nhau ở mỗi trang web. Trong đó menu đa cấp là một dạng phổ biến nhất, hôm nay mình sẽ giới thiệu đến mọi người các tạo menu

Trong một website có lẽ sẽ không bao giờ không có menu, tùy vào mục đích thiết kế và ý tưởng mà menu được thể hiện khác nhau ở mỗi trang web. Trong đó menu đa cấp là một dạng phổ biến nhất, hôm nay mình sẽ giới thiệu đến mọi người các tạo menu đa cấp hay còn gọi multi-level menu đệ quy trong PHP.

Menu là gì? Và tại sao cần phải có menu? Menu là một chỉ mục mà nó trỏ đến một list danh sách bài viết nay một bài viết hoặc một trang web nào đó. Đối với cấp độ người dùng thì menu giống như một sự chỉ dẫn cần thiết cho việc khai thác thông tin website một các hiểu quả. Đối với SEO thì menu cũng rất quan trọng nó giúp đánh giá sự điều hướng liên kết trong SEO.

Qua đó cho thấy sự cần thiết của menu trong WEB, vậy menu đa cấp hay multi-level menu là gì? menu đa cấp hay multi-level menu là một dạng menu mà nó phân ra các chỉ mục rõ ràng cho ta dễ dàng trong việc quản lý tính liên quan của thông tin từ website.

Tạo CSDL cho menu đệ quy

Lúc trước khi muốn tạo menu mấy cấp thì cho mấy bảng dữ liệu và truyền khóa ngoại vào giống như bài tạo menu đa cấp trong ASP.Net còn bây giờ với menu đệ quy thì tất cả các thể loại bạn lưu chỉ cần lưu trong một bảng dữ liệu duy nhất mà thôi.

Đây mình chỉ làm demo nên chỉ cho vào các thuộc tính cần thiết thôi bạn bổ sung vào nha!Trong CSDL trên có ID làm khóa chính, Tên Loại và Loại cha lưu các ID mà nó thuộc vào thể loại đó. Sau đó bạn vào trong host tạo một file menu.php để mình code test thử, bạn nhớ thêm dữ liệu vào để mình kiểm tra xem có đúng với yêu cầu không.

Sau đó khi đã có dữ liệu demo ví dự như trên bạn code menu đa cấp, multi-level menu đệ quy trong PHP như sau:

<!--

<?php

$hostname = "localhost";

$database = "bcdonline_db";

$username = "root";

$password = "root";

$con = mysql_pconnect($hostname, $username, $password) or trigger_error(mysql_error(),E_USER_ERROR); 

mysql_query("set names 'utf8'");

?>

<?php

mysql_select_db($database, $con);

$sql = mysql_query("SELECT * FROM theloai WHERE LoaiCha = 0");

echo '<ul>';

while($row = mysql_fetch_array($sql)){       

echo '<li><a href="#" >'.$row['TenLoai'].'</a></li>';   // Tra lai tat ca cac Menu cha

getSubcategory($row['IDLoai']);        // neu ton tai cac Menu con thi se duoc hien thi

}   

echo '</ul>';

/**

* Ham nay tra lai tat cac cac Menu con

*/

function getSubcategory($loaicha){

$sql = mysql_query("SELECT * FROM theloai WHERE LoaiCha = ".$loaicha);   

while($row = mysql_fetch_array($sql)){

echo '<ul>';

echo '<li><a href="#" >'.$row['TenLoai'].'</a></li>';

getSubcategory($row['IDLoai']);         // *

echo '</ul>';

}   

}

?>

-->

Mình đã phân rõ các phần, hàm của PHP từ việc kết nối CSDL trong php đến truy vấn và hiển thị ra cây menu bằng thể hiện các thẻ UL và LI.

Bây giờ mình chỉ việc CSS lại là có menu đa cấp ngon lành, với các này bạn có thể lập vô tận n cấp tuy nhiên mình chỉ cần một bảng dữ liệu mà thôi.

Ngoài ra bạn còn có thể cho vào trong select option để chọn loại cho, việc làm này rất có ích và chuyên nghiệp trong việc code trang admin có thể loại.

<!--

<label>Loại Cha <span style="color: red;">*</span></label><br />

<select name='LoaiCha'>

<option value="0">Chọn loại cha</option>

<?php 

mysql_select_db ($database, $con);

function Menu($parentid = 0, $space = "", $trees = array())

{

if(!$trees) 

{

$trees = array();

}

$sql = "SELECT * FROM theloai WHERE LoaiCha = $parentid";

$query = mysql_query($sql);

while($rs = mysql_fetch_assoc($query))

{

$trees[] = array( 'IDLoai' => $rs['IDLoai'],

'TenLoai'=>$space.$rs['TenLoai'],

); 

$trees = Menu($rs['IDLoai'], $space.'&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;', $trees); 

}

return $trees;

}

$menu = Menu(0);

foreach($menu as $k => $row)

{

?>

<option value="<?php echo $row['IDLoai']; ?>"><?php echo $row['TenLoai']; ?></option>

<?php

}

?>

</select>

-->

Demo sẽ giống như hình sau:

Kết luận: Bây giờ thì các bạn có thể tạo menu đa cấp, multi-level menu đệ quy trong PHP một cách dễ dàng rồi đúng không nào, hãy CSS và tùy biến lại theo các của bạn, chúc mọi người thành công!