Forums : Xul, Xbl, JS...

salut, alors a mon avis, ca ca ne peut pas marcher. surtout avec un flags="dont-build-content". Pour simuler cela je ferais ceci :

1) je mettrais les infos issus du rdf que tu veux mettre en tooltip dans l'attribut value de la cellule.

 <treecell label="rdf:http://172.25.25.105/supann#nom" value="rdf:http://172.25.25.105/supann#tooltip"/>

quand tu utilise dont-build-content, tu ne peux que lire le label et la value d'une cellule. Respectivement avec tree.view.getCellText et tree.view.getCellValue

2) tu mets un gestionnaire d'evenement onmouseover et onmouseout sur le tree. Sur le mouseover, tu recuperes le num de la row sur laquelle tu es et l'id de la colonne via le code suivant :

 var row = {}, column = {}, elt = {};
 tree.view.getCellAt(event.clientX, event.clientY, row, column, elt);
 var rownum = row.value;
 var colId = column.id;
 // si tu n'es pas sur une ligne de ton tree row.value==-1

3) tu lis l'attribut value

 var tooltip = tree.view.getCellValue(rownum, colId);

4) tu fais apparaitre un element html div avec le contenu que tu desire au position de la souris et voila.

5) sur le mouseover tu cache le div.

Voila, bon ca vaut se que ca vaut, mais comme ca, je ne vois que cette solution, aussi, fais quelque recherche sur les mots clé 'getCellValue', 'getCellAt', 'getCellText', car je garantie pas l'exactitude de mon code, j'ai mis ca de tete... surtout au niveau du colId, car il y a des difference entre la version de firefox 1.5 et les precedente.

Voila si tu a besoins de plus d'info, n'hesites pas.

Si si, il y a moyen d'utiliser un élément tooltip sur un arbre, même avec le flag 'dont-build-content'.

Je pense que ton élément tooltip ne devrais pas se trouver dans ton template, mais plutôt être un frère du tree.

Ensuite tu peux mettre un attribut tooltip="moretip" sur l'élément treechidren.

Enfin dans l'élément tooltip(id="moretip"), tu peux placer un attribut onpopupshowing, qui fera appel à la fonction javascript de ton choix. Celle ci peut récupérer les informations sur la cellule/ligne/colonne comme décrit par hhf, pour modifier le contenu du tooltip en conséquence.

Je l'ai fait dans mon extension boox pour firefox, tu peux la décortiquer pour plus de détail. Par contre, il y a un bug (#317553), l'apparition du tooltip est déclenché 2 fois. Si le contenu (et son traitement) est léger, çà ne se remarque pas, sinon çà tremble un peu... Ma solution a été de n'afficher que la 1ere fois...

merci pour vos conseils. ALors pour le moment, j'arrive a afficher une bulle au dessus de chaque element de mon tree mais j'ai un soucis avec le getCellText. Il ne recupère pas les valeurs a premiere vu... et le getCellValue fait planter firefox...

function bulles(tr, event){
	 var tooltip = document.getElementById("moretip");
 //assignation des valeur
 var row = {}, column = {}, part = {};
  	 var tree = document.getElementById(tr);
 	 var boxobject = tree.boxObject;
 
boxobject.QueryInterface(Components.interfaces.nsITreeBoxObject);
 	 boxobject.getCellAt(event.clientX, event.clientY, row, column, part);
 	 if (typeof column.value != "string") column.value = column.id;
	 //var tool = tree.view.getCellValue(row.value, column.id );
 var des1 = document.createElement("label");
 des1.setAttribute("value", "essai 1 : "+tree.view.getCellText(row.value,column.value) );
 tooltip.appendChild(des1);
} 

<tree id="liste_champs_1" flex="1" ref="urn:data:row" datasources="rdf:null" >
	      <treecols>
	      		<treecol id="nom" label="Nom" primary="true" flex="1"
			class="sortDirectionIndicator" sortActive="false"
			sortDirection="ascending"
			sort="rdf:http://172.25.25.105/supann#nom"/>
			<splitter class="tree-splitter"/>
			<treecol id="prenom" label="Prénom" flex="1"
			class="sortDirectionIndicator" sortActive="true"
			sortDirection="ascending"
			sort="rdf:http://172.25.25.105/supann#prenom"/>
		</treecols>
		<template>
			<treechildren id="treechildren1" tooltip="moretip">
			<treeitem uri="rdf:*">
				  <treerow>
				  	   <treecell label="rdf:http://172.25.25.105/supann#nom" value="rdf:http://172.25.25.105/supann#uid"/>
					   <treecell label="rdf:http://172.25.25.105/supann#prenom" value="rdf:http://172.25.25.105/supann#uid" />
				   </treerow>
			</treeitem>
			</treechildren>
		</template>
	</tree>

Voila les bout de js et de xul. D'avance merci pour vos reponses

Bon ben j'ai trouvé lol En fait il faut mettre : tree.view.getCellText(row.value,column) et tree.view.getCellValue(row.value,column)

voila

un petit soucis: j'arive a faire ma bulle comme je le souhaite avec les infos qui vont bien que je recupere grace a un fichier php qui retourne du xml a mon javascript mais lors d'un premier passage sur un element j'ai toute les infos (6) au second passage, j'en est 3 est au troisieme j'en est 1 puis au quatrieme j'ai de nouveau toute les infos. Ca nous fait donc un truc du genre : 6-3-1-6-3-1-6-3-1... mais je ne comprends pas pourquoi...

voici le php :

<?php
define('EOL', "\r\n");
require_once("supann_group.php");
// Connexion à l'annuaire
$supann_db =& NewADOConnection(DSN_SUPANN_DB) or die("Connexion impossible à la base supann");
$res = $supann_db->Execute("SET NAMES 'utf8'");
// execution de la requète SQL
$supann_db =& NewADOConnection(DSN_SUPANN_DB) or die("Connexion impossible à la base supann");
if(isset($_POST['uid']) && trim($_POST['uid']) != ''){
$sql = 'SELECT eduPersonPrimaryAffiliation, internalRefService, postalAddress, telephoneNumber, mobile, facsimileTelephoneNumber  FROM people WHERE uid ="'.$_POST['uid'].'" ';
$res = $supann_db->Execute("SET NAMES 'utf8'");
$res = $supann_db->Execute($sql);
$result = $res->GetArray();

if($res == false){
	echo mysql_error($cnx);
}
else{
     header('Content-type: text/xml');
     // boucle de récupération des enregistrements de la requête
     foreach($result as $row){
     	echo '<?xml version="1.0" encoding="ISO-8859-1"?>'
  		. '<description>'
  		. '<affiliation info="'.$row['eduPersonPrimaryAffiliation'].'" />'
	. '<composante info="'.$row['internalRefService'].'" />'
  		. '<adresse_postale info="'.$row['postalAddress'].'" />'
  		. '<telephone info="'.$row['telephoneNumber'].'" />'
  		. '<telephonebis info="'.$row['facsimileTelephoneNumber'].'" />'
  		. '<mobile info="'.$row['mobile'].'" />'
  		. '</description>';
     }

}
}
?>

et le javascript :

function bulles(tr, event){
 var tooltip = document.getElementById("moretip");
 var uid;
 //pour la suppression des fils
 var fils = tooltip.childNodes; 
 var numfils = fils.length; 
 for(var i = 0; i<numfils;i++){ 
 	 tooltip.removeChild(fils[i]); 
 }
 //assignation des valeur
 var row = {}, column = {}, part = {};
 	 var tree = document.getElementById(tr);
 	 var boxobject = tree.boxObject;
 	 boxobject.QueryInterface(Components.interfaces.nsITreeBoxObject);
 	 boxobject.getCellAt(event.clientX, event.clientY, row, column, part);
 	 if (typeof column.value != "string") column.value = column.id;
 var uid = tree.view.getCellValue(row.value,column);
 var chaine = escape("uid")+"="+escape(uid);
 p = new XMLHttpRequest();
 	 p.onload = null;
 p.open("POST","./bulle.php", false);
  	 p.setRequestHeader("Content-type","application/x-www-form-urlencoded");
  	 p.send(chaine);
  	 status = p.status;
  	 if ( status != "200" ) {
    	 alert("arg ! mauvaise réponse http ("+ status +")");
  	 } else {
  	   	var description = p.responseXML.documentElement;
	var affiliation = description.getElementsByTagName('affiliation')[0].getAttribute('info');
		var composante = description.getElementsByTagName('composante')[0].getAttribute('info');
	var addresse = description.getElementsByTagName('adresse_postale')[0].getAttribute('info');
		var telephone = description.getElementsByTagName('telephone')[0].getAttribute('info');
	var telephonebis = description.getElementsByTagName('telephonebis')[0].getAttribute('info');
		var mobile = description.getElementsByTagName('mobile')[0].getAttribute('info');
  	 }
 var des1 = document.createElement("label");
 des1.setAttribute("value", "Affiliation : "+ affiliation);
 tooltip.appendChild(des1);
 var des2 = document.createElement("label");
 des2.setAttribute("value", "Composante : "+ composante);
 tooltip.appendChild(des2);
 var des3 = document.createElement("label");
 des3.setAttribute("value", "Adresse postale : "+ addresse);
 tooltip.appendChild(des3);
 var des4 = document.createElement("label");
 des4.setAttribute("value", "N° de telephone : "+ telephone);
 tooltip.appendChild(des4);
 var des5 = document.createElement("label");
 des5.setAttribute("value", "N° de telephone bis : "+ telephonebis);
 tooltip.appendChild(des5);
 var des6 = document.createElement("label");
 des6.setAttribute("value", "N° de telephone mobile : "+ mobile);
 tooltip.appendChild(des6);
}

D'avance merci pour vos réponses.

Personne n'a d'idée?

Vraiment personne pour un coup de pouce?

erreur de debutant...

var numfils = fils.length; 
for(var i = 0; i<numfils;i++){ 
	 tooltip.removeChild(fils[i]); 
}

TRES MAUVAIS

for(var i=tooltip.childNodes.length; i>=0; i--) tooltip.removeChild(fils[i]); 

ou alors

for(var i=0; i<tooltip.childNodes.length; i++) tooltip.removeChild(fils[0]); 

BEAUCOUP MIEUX

Admettons tu as 5 fils, dans ton cas, tu supprimes le 0, puis le 1, qui est en fait le 2 puisque le 1 est devenu le 0 etc...

OULA toi aussi tu as fait une erreur de debutant... Comme ceci ca marche mieux :

for(var i=tooltip.childNodes.length-1; i>=0; i--)  tooltip.removeChild(tooltip.childNodes[i]);

Mais vraiment merci.

Bonjour, Comment faire pour revenir a la ligne dans une bulle d'aide sans faire un nouveau label ou autre.

Je fait ceci dans mon code php :

foreach($result as $row){$lib_etp = $lib_etp.$row['lib_etp'];}
...
...
echo '<?xml version="1.0" encoding="ISO-8859-1"?>' ...
...
...
. '<composante2 info="'.$lib_etp.'" />'

et comme $lib_etp est trop long, je ne voie pas tout, ce qui est legerement ennuyeux...