TENGO UN MENU TIPO ARBOL CON UNA TABLA RECURSIVA QUE ME JALA LOS DATOS AL ARBOL
LA GRAFICA BIEN PERO NECESITO QUE AL SELECCIONAR UNO DE LOS CAMPOS DEL MENU
EJEMPLO:
- AZUAY
- CANTON
- PARROQUIA (SELECCIONO CON EL MOUSE)
ME CAPTURE ESA SELECCION EN UN CUADRO DE TEXTO DE ESTE MODO : AZUAY/CANTON/PARROQUIA
Código PHP:
class tree{
var $elementArray = array();
var $nameOfCookie = "menu_expandido";
function tree()
{
}
function writeCSS()
{
?>
<style type="text/css">
#tree li{
list-style-type:none;
font-family: arial;
font-size:11px;
}
#dhtmlgoodies_topNodes{
margin-left:0px;
padding-left:0px;
}
#dhtmlgoodies_topNodes ul{
margin-left:20px;
padding-left:0px;
display:none;
}
#tree .tree_link{
line-height:13px;
padding-left:2px;
}
#tree img{
padding-top:2px;
}
#tree a{
color: #000000;
text-decoration:none;
}
.activeNodeLink{
background-color: #316AC5;
color: #FFFFFF;
font-weight:bold;
}
</style>
<?php
}
function writeJavascript()
{
?>
<script type="text/javascript">
var plusNode = 'estilos/mas.gif';
var minusNode = 'estilos/menos.gif';
var nameOfCookie = '<?php echo $this->nameOfCookie; ?>';
<?php
$cookieValue = "";
if(isset($_COOKIE[$this->nameOfCookie]))$cookieValue = $_COOKIE[$this->nameOfCookie];
echo "var initExpandedNodes =\"".$cookieValue."\";\n";
?>
function Get_Cookie(name) {
var start = document.cookie.indexOf(name+"=");
var len = start+name.length+1;
if ((!start) && (name != document.cookie.substring(0,name.length))) return null;
if (start == -1) return null;
var end = document.cookie.indexOf(";",len);
if (end == -1) end = document.cookie.length;
return unescape(document.cookie.substring(len,end));
}
function Set_Cookie(name,value,expires,path,domain,secure) {
expires = expires * 60*60*24*1000;
var today = new Date();
var expires_date = new Date( today.getTime() + (expires) );
var cookieString = name + "=" +escape(value) +
( (expires) ? ";expires=" + expires_date.toGMTString() : "") +
( (path) ? ";path=" + path : "") +
( (domain) ? ";domain=" + domain : "") +
( (secure) ? ";secure" : "");
document.cookie = cookieString;
}
function expandAll()
{
var treeObj = document.getElementById('tree');
var images = treeObj.getElementsByTagName('IMG');
for(var no=0;no<images.length;no++){
if(images[no].className=='tree_plusminus' && images[no].src.indexOf(plusNode)>=0)expandNode(false,images[no]);
}
}
function collapseAll()
{
var treeObj = document.getElementById('tree');
var images = treeObj.getElementsByTagName('IMG');
for(var no=0;no<images.length;no++){
if(images[no].className=='tree_plusminus' && images[no].src.indexOf(minusNode)>=0)expandNode(false,images[no]);
}
}
function expandNode(e,inputNode)
{
if(initExpandedNodes.length==0)initExpandedNodes=",";
if(!inputNode)inputNode = this;
if(inputNode.tagName.toLowerCase()!='img')inputNode = inputNode.parentNode.getElementsByTagName('IMG')[0];
var inputId = inputNode.id.replace(/[^\d]/g,'');
var parentUl = inputNode.parentNode;
var subUl = parentUl.getElementsByTagName('UL');
if(subUl.length==0)return;
if(subUl[0].style.display=='' || subUl[0].style.display=='none'){
subUl[0].style.display = 'block';
inputNode.src = minusNode;
initExpandedNodes = initExpandedNodes.replace(',' + inputId+',',',');
initExpandedNodes = initExpandedNodes + inputId + ',';
}else{
subUl[0].style.display = '';
inputNode.src = plusNode;
initExpandedNodes = initExpandedNodes.replace(','+inputId+',',',');
}
Set_Cookie(nameOfCookie,initExpandedNodes,60);
}
function initTree()
{
var parentNode = document.getElementById('tree');
var lis = parentNode.getElementsByTagName('LI'); // Get reference to all the images in the tree
for(var no=0;no<lis.length;no++){
var subNodes = lis[no].getElementsByTagName('UL');
if(subNodes.length>0){
lis[no].childNodes[0].style.visibility='visible';
}else{
lis[no].childNodes[0].style.visibility='hidden';
}
}
var images = parentNode.getElementsByTagName('IMG');
for(var no=0;no<images.length;no++){
if(images[no].className=='tree_plusminus')images[no].onclick = expandNode;
}
var aTags = parentNode.getElementsByTagName('A');
var cursor = 'pointer';
if(document.all)cursor = 'hand';
for(var no=0;no<aTags.length;no++){
aTags[no].onclick = expandNode;
aTags[no].style.cursor = cursor;
}
var initExpandedArray = initExpandedNodes.split(',');
for(var no=0;no<initExpandedArray.length;no++){
if(document.getElementById('plusMinus' + initExpandedArray[no])){
var obj = document.getElementById('plusMinus' + initExpandedArray[no]);
expandNode(false,obj);
}
}
}
window.onload = initTree;
</script>
<?php
}
function addToArray($id,$name,$parentID,$url="",$target="",$imageIcon="estilos/arrow.gif"){
if(empty($parentID))$parentID=0;
$this->elementArray[$parentID][] = array($id,$name,$url,$target,$imageIcon);
}
function drawSubNode($parentID){
if(isset($this->elementArray[$parentID])){
echo "<ul>";
for($no=0;$no<count($this->elementArray[$parentID]);$no++){
$urlAdd = "";
if($this->elementArray[$parentID][$no][2]){
$urlAdd = " ";
if($this->elementArray[$parentID][$no][3])$urlAdd.="";
}
echo "<li class=\"tree_node\"><img class=\"tree_plusminus\" id=\"plusMinus".$this->elementArray[$parentID][$no][0]."\" src=\"estilos/mas.gif\"><img src=\"".$this->elementArray[$parentID][$no][4]."\"><a class=\"tree_link\"$urlAdd>".$this->elementArray[$parentID][$no][1]."</a>";
$this->drawSubNode($this->elementArray[$parentID][$no][0]);
echo "</li>";
}
echo "</ul>";
}
}
function drawTree(){
echo "<div id=\"tree\">";
echo "<ul id=\"dhtmlgoodies_topNodes\">";
for($no=0;$no<count($this->elementArray[0]);$no++){
$urlAdd = "";
if($this->elementArray[0][$no][2]){
$urlAdd = " ";
if($this->elementArray[0][$no][3])$urlAdd.="";
}
echo "<li class=\"tree_node\" id=\"node_".$this->elementArray[0][$no][0]."\"><img id=\"plusMinus".$this->elementArray[0][$no][0]."\" class=\"tree_plusminus\" src=\"estilos/mas.gif\"><img src=\"".$this->elementArray[0][$no][4]."\"><a class=\"tree_link\"$urlAdd>".$this->elementArray[0][$no][1]."</a>";
$this->drawSubNode($this->elementArray[0][$no][0]);
echo "</li>";
}
echo "</ul>";
echo "</div>";
}
}
Mode Lineal
