JSP e Oracle - Para apresentar uma  Treeview
Autor: ralencar | Publicado: 2009-08-24T16:39:00-03:00

Olá pessoal!Dando manutenção em um sistema java web com interface jsp precisei usar uma treeview para apresentar as categorias de produtos para o usuário. Vou relatar aqui a experiência.As categorias estão modeladas no banco em uma tabela com autorelacionamento.No oracle para consultar uma table com autorelacionamento podemos utilizar a seguinte query:select id, LEVEL, SYS_CONNECT_BY_PATH(nome, '@') as caminhofrom categoria CONNECT BY parent_id = PRIOR id START WITH id = categoria_inicialA categoria_inicial é a primeira categoria de uma árvore, nesse sistemas existem várias árvores de categorias.O resultado fica assim para a categoria_inicial igual a 30:id  level caminho30  1     @Material de escritório31  2     @Material de escritório@Informática34  3     @Material de escritório@Informática@Tinta55  4     @Material de escritório@Informática@Tinta@Tinta Impressoras60  3     @Material de escritório@Informática@Armazenamento63  4     @Material de escritório@Informática@Armazenamento@DAT/DLT/DVD/DDS64  4     @Material de escritório@Informática@Armazenamento@Disquetes92  3     @Material de escritório@Informática@Teste93  4     @Material de escritório@Informática@Teste@Teste1113 4     @Material de escritório@Informática@Teste@Teste2120 4     @Material de escritório@Informática@Teste@Test3Ai no java criei uma classe para representar a estrutura da categoria, ficou assim:public class CategoriaTreeView { public String id; public int level; public String path; public CategoriaTreeView(String id, int level, String path){  this.id = id;  this.level = level;  this.path = path; }}Como essa classe vai ser utilizada somente como uma estrutura de dados para representar o dado que será exibido na tela ela não tem gets e sets. Nem toda classe java precisa ter gets e sets. Gets e sets aqui são desnecessários e não acresentam nada. Acredite. Mas isso é assunto para outro post.Também tenho um DAO que acessa o banco e entrega um List com os objetos CategoriaTreeView.Antes disso fiz uma pesquisa na internet sobre como criar uma treeview no jsp (ou html) e encontrei o jQuery plugin: Treeview que transforma uma lista não ordenada do html &lt;ul&gt; em uma árvore.Agora o problema é transformar a minha coleção de CategoriaTreeView em uma lista não ordenada com &lt;ul&gt; e &lt;li&gt;. Para isso eu criei a seguinte função recursiva que retorna uma String que será utilizada dentro do html:private String processa(int atual, List&lt;CategoriaTreeView&gt; lista){ if(lista == null) return ""; String out = ""; if(lista.size() == 0) {  if(atual &gt; 0){   out += "&lt;/li&gt;\n";   out += "&lt;/ul&gt;\n";   out += processa(atual - 1, lista);  } }else if(lista.size()&gt;0){  CategoriaTreeView item = lista.remove(0);  if(item.level == atual){   out += "&lt;/li&gt;\n";   out += "&lt;li&gt;&lt;span&gt;" + subString(item.level, item.path) + "&lt;/span&gt;\n";   out += processa(item.level, lista);  }else if(item.level &gt; atual){   out += "&lt;ul&gt;\n";   out += "&lt;li&gt;&lt;span&gt;" + subString(item.level, item.path) + "&lt;/span&gt;\n";   out += processa(item.level, lista);  }else if(item.level &lt; atual){   out += "&lt;/li&gt;\n";   out += "&lt;/ul&gt;\n";   // adiciono o cara de volta na lista pois ainda não foi processado. estou voltando um nivel na árvore.   lista.add(0, item);   out += processa(atual - 1, lista);  } } return out;}Também temos a função para retornar a categoria de dentro do caminho:private String subString(int i, String s){ String[] ss = s.split("@"); return ss[i];}Dentro do meu servlet eu tenho o seguinte código:ArrayList categorias = dao.categorias(categoria_inicial);String treeView = processa(0, categorias);treeView = treeView.replaceFirst("&lt;ul&gt;", "&lt;ul id=\"browser\"&gt;");request.setAttribute("treeView", treeView);Para exibir a treeview no jsp eu utilizei o exemplo simple.html que vem no download do jQuery plugin: Treeview. A única mudança foi que eu fiz o download do jquery ao invés de usar o link direto do ajax.googleapis.com. Adicionei o seguinte ao jsp:&lt;link rel="stylesheet" href="../jquery.treeview.css" /&gt;&lt;link rel="stylesheet" href="../red-treeview.css" /&gt;&lt;link rel="stylesheet" href="screen.css" /&gt;&lt;script type="text/javascript" src="jquery-1.3.2.min.js"&gt;&lt;/script&gt;&lt;script src="../lib/jquery.cookie.js" type="text/javascript"&gt;&lt;/script&gt;&lt;script src="../jquery.treeview.js" type="text/javascript"&gt;&lt;/script&gt;&lt;script type="text/javascript"&gt;$(document).ready(function(){ $("#browser").treeview({control: "#treecontrol", animated:"normal", persist: "cookie"});});&lt;/script&gt;&lt;%String s = (String)request.getAttribute("treeView");if(s != null &amp;&amp; !s.trim().equals("")){%&gt;&lt;tr&gt; &lt;td&gt; &lt;br&gt;  &lt;div id="treecontrol"&gt;   &lt;a title="Collapse the entire tree below" href="#"&gt;Fechar Tudo&lt;/a&gt;   &lt;a title="Expand the entire tree below" href="#"&gt;Abrir Tudo&lt;/a&gt;  &lt;/div&gt; &lt;/td&gt;&lt;/tr&gt;&lt;tr&gt; &lt;td&gt; &lt;br&gt; &lt;div&gt;&lt;%= s %&gt;&lt;/div&gt; &lt;/td&gt;&lt;/tr&gt;&lt;%}%&gt;O resultado fica parecido com esse demo que está no site.Abraços, Rodrigo Alencar.