Generar menú y sub Menús desde la base de datos:
vista previa al finalizar.
Hoy en día hay en algunos proyectos necesitamos generar el menú desde la base de datos y hay diferente formas de poder realizarlos en este ejemplo utilizaremos el concepto de recursividad.
El menú consta de una clase Menu Entity y con otra la que se encarga de generar los menús padre y los sub menu TreeMenuEntity.
Para poder armar el menú en lado de la vista utilizaremos la api Jquery , Jquery smartmenus, bootstrap.
Utilizaremos el Right nav de nuestro nav var de bootstrap. si desean el código completo pueden dejar sus correos en los comentarios.
MenuEntity.java
package com.cloudsrcsoft.menu;
import java.util.List;
public class MenuEntity {
private List<MenuEntity> menus;
private String controller;
private String module;
public MenuEntity(String controller, String module, List<MenuEntity> menus) {
super();
this.menus = menus;
this.controller = controller;
this.module = module;
}
public List<MenuEntity> getMenus() {
return menus;
}
public void setMenus(List<MenuEntity> menus) {
this.menus = menus;
}
public String getController() {
return controller;
}
public void setController(String controller) {
this.controller = controller;
}
public String getModule() {
return module;
}
public void setModule(String module) {
this.module = module;
}
@Override
public String toString() {
return "MenuEntity [menus=" + menus + ", controller=" + controller + ", module=" + module + "]";
}
}
TreeMenuEntity.java
package com.cloudsrcsoft.menu;
import java.util.ArrayList;
import java.util.List;
public class TreeMenuEntity {
public int idObject;
public int idParent;
public String controller;
public String action;
public String nameModule;
public int getIdObject() {
return idObject;
}
public void setIdObject(int idObject) {
this.idObject = idObject;
}
public int getIdParent() {
return idParent;
}
public void setIdParent(int idParent) {
this.idParent = idParent;
}
public String getController() {
return controller;
}
public void setController(String controller) {
this.controller = controller;
}
public String getAction() {
return action;
}
public void setAction(String action) {
this.action = action;
}
public String getNameModule() {
return nameModule;
}
public void setNameModule(String nameModule) {
this.nameModule = nameModule;
}
public static List<MenuEntity> GenerarMenu(List<TreeMenuEntity> TreeMenuEntitys)
{
List<MenuEntity> menuList = new ArrayList<MenuEntity>();
for(TreeMenuEntity treeMenuEntitys: TreeMenuEntitys)
{
if (treeMenuEntitys.idParent == 0)
{
String urlaction = treeMenuEntitys.getController() + "/" + treeMenuEntitys.getAction();
menuList.add(new MenuEntity(urlaction, treeMenuEntitys.getNameModule(), GenerarSubMenu(TreeMenuEntitys, treeMenuEntitys)));
}
}
return menuList;
}
public static List<MenuEntity> GenerarSubMenu(List<TreeMenuEntity> TreeMenuEntitys, TreeMenuEntity treeMenuEntitys)
{
List<MenuEntity> menuList = new ArrayList<MenuEntity>();
for (TreeMenuEntity objeto : TreeMenuEntitys)
{
if (objeto.idParent == treeMenuEntitys.idObject)
{
String urlaction = objeto.getController() + "/" + objeto.getAction();
menuList.add(new MenuEntity(urlaction, treeMenuEntitys.getNameModule(), GenerarSubMenu(TreeMenuEntitys, objeto)));
}
}
return menuList;
}
}
Test.java
package com.cloudsrcsoft.menu;
import java.util.ArrayList;
import java.util.List;
public class Test {
public static void main(String[] args) {
List<TreeMenuEntity> lst = new ArrayList<TreeMenuEntity>();
TreeMenuEntity sec1 = new TreeMenuEntity();
TreeMenuEntity sec2 = new TreeMenuEntity();
TreeMenuEntity sec3 = new TreeMenuEntity();
TreeMenuEntity sec4 = new TreeMenuEntity();
TreeMenuEntity sec5 = new TreeMenuEntity();
TreeMenuEntity sec6 = new TreeMenuEntity();
sec1.setIdObject(1);
sec1.setIdParent(0);
sec1.setController("Controller");
sec1.setAction("ShowNotice");
sec1.setNameModule("Soy Modulo 1");
sec2.setIdObject(2);
sec2.setIdParent(1);
sec2.setController("Controller");
sec2.setAction("ShowList");
sec2.setNameModule("Soy Modulo de 1.1");
sec3.setIdObject(3);
sec3.setIdParent(2);
sec3.setController("Controller");
sec3.setAction("ShowNotice");
sec3.setNameModule("Soy Modulo de 1.1.1");
sec4.setIdObject(4);
sec4.setIdParent(0);
sec4.setController("Controller");
sec4.setAction("ShowNotice");
sec4.setNameModule("Soy Modulo 2");
sec5.setIdObject(5);
sec5.setIdParent(4);
sec5.setController("Soy Controlador de 2.1");
sec5.setAction("ShowNotice");
sec5.setNameModule("Soy Modulo de 2.1");
sec6.setIdObject(6);
sec6.setIdParent(5);
sec6.setController("Controller");
sec6.setAction("ShowNotice");
sec6.setNameModule("Update");
lst.add(sec1);
lst.add(sec2);
lst.add(sec3);
lst.add(sec4);
lst.add(sec5);
lst.add(sec6);
System.out.println(TreeMenuEntity.GenerarMenu(lst));
}
}
Emp.java
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page session="false" %>
<html>
<head>
<title>Menu Recursivo</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://vadikom.github.io/smartmenus/src/addons/bootstrap/jquery.smartmenus.bootstrap.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://vadikom.github.io/smartmenus/src/jquery.smartmenus.js"></script>
<script src="https://vadikom.github.io/smartmenus/src/addons/bootstrap/jquery.smartmenus.bootstrap.js"></script>
</head>
<script>
$(document).ready(function(){
var menu = []; // en esta parte se tiene que realizar la llamada mediante ajax a un controlador para armar el menú
$("#menu").append(buildMenu(menu));
$("#menu").smartmenus('refresh');
});
function buildMenu(menu) {
var li = "";
for (var i = 0 ; i < menu.length ; i++) {
li += '<li ><a href="#" > titulo';
if (menu[i].subMenu != null && menu[i].subMenu != '') {
li += '<span class="caret"></span></a>';
li += '<ul class="dropdown-menu">';
li += buildMenu(menu[i].subMenu) + "</ul></li>";
}else{
li += "</a></li>";
}
}
return li;
}
</script>
<body>
<!-- Navbar static top -->
<div class="navbar navbar-default navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="navbar-collapse collapse">
<!-- Left nav -->
<ul class="nav navbar-nav">
<li><a href="#">Link</a></li>
<li><a href="#">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">A long sub menu <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Something else here</a></li>
<li class="disabled"><a class="disabled" href="#">Disabled item</a></li>
<li><a href="#">One more link</a></li>
<li><a href="#">Menu item 1</a></li>
<li><a href="#">Menu item 2</a></li>
<li><a href="#">Menu item 3</a></li>
</ul>
</li>
<li><a href="#">Another link</a></li>
<li><a href="#">One more link</a></li>
</ul>
</li>
</ul>
</li>
</ul>
<!-- Right nav -->
<ul class="nav navbar-nav navbar-right" id = "menu">
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container -->
</div>
</body>
</html>
Buen aporte estimado, si pudieras para ver elcodigo enviarmelo al correo jcaguilar40@gmail.com
ResponderEliminarbuen dia compañero... está excelente el ejemplo... porfavor compárteme el codigo completo... mhoyos27y@gmail.com
ResponderEliminarGracias
Buen día, excelente ejemplo me encantaría el código completo
ResponderEliminarluis.rodriguez.des@gmail.com
Muchas gracias
Saludos
excelente aporte amigo, agradecido de antemano por tu apoyo, si pudieras compartir tu codigo a mi correo. esotop8@gmail.com gracias !!!
ResponderEliminarque genial el aporte, muy bueno, por favor si pudieras compartirme el código completo, te agradecería mucho, adjunto mi correo david3292@hotmail.es
ResponderEliminarGracias
Pudieras compartir el codigo pf sscipres@gmail.com
ResponderEliminar