Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

grandems

[Resolvido] Treeview com múltiplos níveis

Recommended Posts

Colegas,

 

Imaginem um banco MySql com aproximadamente 20000 registros, contendo a estrutura:

 

ID (int)

Descricao (Text)

Pai (int)

 

Com a seguinte populacao:

1, Nivel 1, 0

2, Nivel 2, 0

3, Nivel 1.1, 1

4, Nivel 1.2, 1

5, Nivel 2.1, 2

6, Nivel 2.2, 2

7, Nivel 1.1.1, 3

8, Nivel 1.2.1, 4

9, Nivel 1.2.1.1, 8

10, Nivel 1.2.1.1.1, 9

11, Nivel 1.2.1.1.1.1, 10

12, Nivel 1.2.1.1.1.1.1, 11

13, Nivel 2.3,2

14, Nivel 2.3.1, 13

 

Para entender, basta ir comparando o Pai com o ID anterior....

 

E por vai...

 

Para que o browser consiga rodar, não dá para ir acumulando o vetor para apresentar somente no final com o document.write.

 

O desafio é, fazer o vetor ser alimentado e ir renderizando no browser.

 

Tem um script bem legal que monta o exemplo acima com facilidade, no entanto só renderiza no final. Ai, uns 6000 mil itens com uns 5 ou 6 subniveis não consegue rodar.

 

Veja abaixo o script que pode ser utilizado como exemplo:

 

http://destroydrop.com/javascripts/tree/

Compartilhar este post


Link para o post
Compartilhar em outros sites

com php ??

Na verdade é mesclado, gostaria que durante a montagem já fosse gerando o JS.

 

Diogo, eu acabei conseguindo uma solução que faz o que preciso...

 

Obrigado pelo retorno.

 

exemplo.php

--------------

<!doctype html public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<title>Centro de Custo</title>

<link rel="stylesheet" type="text/css" href="css/multi/tree.css">

<script type="text/javascript" src="build/yahoo.js" ></script>

<script type="text/javascript" src="build/event.js"></script>

<script type="text/javascript" src="build/treeview.js" ></script>

<script type="text/javascript" src="build/jktreeview.js" ></script>

<!-- Below is Style sheet for demos. Removed if desired -->

<style type="text/css">

body {font: normal 10px verdana, sans-serif; color: #333; line-height: 19px;}

a { text-decoration: underline; color: #46546C; }

a:hover { text-decoration: underline; color: #4d77c3; }

#tree2 {width:800px;padding: 10px;float:left;}

</style>

</head>

<body>

<!--Empty DIV tags to contain the treeview demos -->

<div id="tree2"><!-- exemplo da tree 2--></div>

<script type="text/javascript">

<?php

include_once("DoMenu.php");

include_once("connection.php");

echo DoMenu("tab_ccusto","myCustomTree2","tree2");

?>

</script>

</body>

</html>

 

DoMenu.php

-------------

<?php

/**

* Construir menu

*

* @param String $tabela

* @param String $treeName

* @param String $div

* @return String

*/

function DoMenu($tabela,$treeName,$div){

$db=connectDB();

$sql=mysql_query("Select id, descricao, link, pai From $tabela");

while($myrow=mysql_fetch_array($sql))

{

$mdesc = str_replace('"','',$myrow["descricao"]);

$content.=DoMenuNode($treeName,$myrow["id"],$mdesc,$myrow["pai"],$myrow["link"]);

}

mysql_close($db);

return "var $treeName=new jktreeview(\"$div\");\r\n$content$treeName.treetop.draw();

//REQUIRED LINE: Initalize tree\r\n";}

/**

* Construir nó (função auxiliar da função DoMenu)

*

* @param String $treeName

* @param int $nodeNumber

* @param String $nodeDescription

* @param int $nodeBelongsTo

* @param String $nodeLink

* @return String

*/

function DoMenuNode($treeName,$nodeNumber,$nodeDescription,$nodeBelongsTo,$nodeLink)

{

$nodeBelongsTo=($nodeBelongsTo>0)?"no$nodeBelongsTo":"\"\"";

$nodeLink=($nodeLink)?(",\"$nodeLink\""):"";

return "var no$nodeNumber=$treeName.addItem(\"$nodeDescription\",$nodeBelongsTo $nodeLink);\r\n";

}

?>

 

 

connection.php

-----------------

<?php

function connectDB()

{

$db = mysql_connect("localhost", "root", "senha");

mysql_select_db("meubanco",$db) or die("<b><br>Impossivel aceder á base de dados</b><BR>");

return $db;

}

?>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.