IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Ext JS / Sencha Discussion :

Tree, Afficher un tooltip dynamique (request JSON) ?


Sujet :

Ext JS / Sencha

  1. #1
    Membre habitué
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    624
    Détails du profil
    Informations personnelles :
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Mars 2005
    Messages : 624
    Points : 199
    Points
    199
    Par défaut Tree, Afficher un tooltip dynamique (request JSON) ?
    Salut tout le monde,
    (MVC + ExtJS4 + Tree)

    J'ai actuellement un Treegrid dans lequel je voudrais afficher pour certains noeuds, un tooltip.
    Je sais qu'il suffit en statique d'ajouter à mon Store, un qtip.

    Mais moi, je voudrais afficher des infos que je vais chercher dans une BdD via une requête Ext.Ajax.request.

    Est-ce qu'une âme charitable aurait un petit bout de code pour me montrer ce que je pourrais mettre dans le itemmouseenter (ou un autre) du listener.
    Et comment affecter bien sûr à qtip les infos recueillis?

    D'avance merci pour votre aide,

    PS: je continue à chercher de mon côté....

  2. #2
    Membre habitué
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    624
    Détails du profil
    Informations personnelles :
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Mars 2005
    Messages : 624
    Points : 199
    Points
    199
    Par défaut
    Trouvé !

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    itemmouseenter: function( view, record, item, rowIndex, e, eOpts ) {
    	this.tip = Ext.create('Ext.tip.ToolTip', {
    		target: view.el,          // The overall target element.
    		delegate: view.itemSelector, // Each grid row causes its own seperate show and hide.
    		trackMouse: true,         // Moving within the row should not hide the tip.
    		renderTo: Ext.getBody(),  // Render immediately so that tip.body can be referenced prior to the first show.
    		listeners: {              // Change content dynamically depending on which element triggered the show.
    			beforeshow: function updateTipBody(tip) {
    				tip.update('My Variable Text Here');
    			}
    		}
    	});
    },

  3. #3
    Membre habitué
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    624
    Détails du profil
    Informations personnelles :
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Mars 2005
    Messages : 624
    Points : 199
    Points
    199
    Par défaut
    Bon, je me suis un peu emporté, hélas cela ne fonctionne pas si je veux mettre à l'intérieur une requête AJAX pour récupérer les données correspondantes au nœud.

    Ceci ne fonctionne pas :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    itemmouseenter: function( view, record, item, rowIndex, e, eOpts ) {
    	// http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.tip.ToolTip
    	this.tip = Ext.create('Ext.tip.ToolTip', {
    		target      : view.el,              // The overall target element.
    		delegate    : view.itemSelector,    // Each grid row causes its own seperate show and hide.
    		trackMouse  : true,                 // Moving within the row should not hide the tip.
    		renderTo    : Ext.getBody(),        // Render immediately so that tip.body can be referenced prior to the first show.
    		//showDelay   : 2000,
    		listeners: {                        // Change content dynamically depending on which element triggered the show.
    			beforeshow: function updateTipBody(tip) {
    				tip.update('Please wait...');
    				Ext.Ajax.request({
    					url         : 'data/item/read.php',
    					method      : 'POST',
    					params: {
    						cid     : PatentPulse.profileUser.get('cid'),
    						lid     : PatentPulse.profileUser.get('id'),
    						json_id : record.get('id')
    					},
    					success : function(response){
    						// convert text response to javascript object
    						var res = Ext.JSON.decode(response.responseText);
     
    						// if server response contains "success" node, then success!        
    						if ((res.success === true) && (res.total>0)) 
    						{   
    							tip.update(res.data[0]["item"]);
    						} else
    						{
     
    						}
    					},
    					failure : function(response){
     
    					}
    				});    
    			}
    		}
    	});
    }
    Premièrement, j'ai ma requête AJAX qui est exécutée plusieurs fois au lieu d'une unique fois lorsque je rentre sur un nœud.

    Deuxièmement, je ne pense pas que je doive définir ma fonction autant de fois non ?

    Un peu d'aide serait la bienvenue.

    De mon côté, je cherche une autre solution... ou une meilleure adaptation. :'(

  4. #4
    Expert éminent
    Avatar de sekaijin
    Homme Profil pro
    Urbaniste
    Inscrit en
    Juillet 2004
    Messages
    4 205
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 60
    Localisation : France, Yvelines (Île de France)

    Informations professionnelles :
    Activité : Urbaniste
    Secteur : Santé

    Informations forums :
    Inscription : Juillet 2004
    Messages : 4 205
    Points : 9 127
    Points
    9 127
    Par défaut
    il y a un truc contradictoire dans ce que tu veux faire.

    lorsque l'utilisateur va passé sa souris sur un noeud tu va envoyer une requête ajax
    puis l'utilisateur pas se déplacer et probablement passer sur un autre noeud
    tu va envoyer une autre requête ajax.
    l'utilisateur va encore avoir le temps de faire autre chose comme quitter le panel

    puis à un moment donnée on sais pas quand la première réponse ajax va arrivé et le qtip va s'afficher sur le premier neud

    et pareil pour les appel suivant.

    ne craints tu pas que ça fasse n'importe quoi du point de vu du client ??

    un quick tip par définition doit être quick et s'afficher immédiatement ce n'est pas fait pour collecter de l'info mais notifier rapidement l'utilisateur sur l'objet.

    je pense qu'utiliser un qtip pour ça est une mauvaise approche en terme d'usage. même si techniquement c'est réalisable, le rendu utilisateur ne pourra qu'être au mieux médiocre.

    dans un arbre on vise rarement le noeud que l'on veut du premier coup
    l'utilisateur vas en survoler une petite dizaine et tout d'un coup alors qu'il sera sur celui qui l'interesse tous les autres vont se mettre à afficher des qtip.


    A+JYT

  5. #5
    Membre habitué
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    624
    Détails du profil
    Informations personnelles :
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Mars 2005
    Messages : 624
    Points : 199
    Points
    199
    Par défaut
    Bonjour Sekaijin,

    Effectivement je commence à penser comme toi.

    Je vais chercher une solution complétement différente et laisser tomber cette méthode pour l'instant.

    Sur ce bon Week end )

Discussions similaires

  1. [CR] afficher une image dynamiquement
    Par Jacques Bergeron dans le forum SAP Crystal Reports
    Réponses: 1
    Dernier message: 16/02/2006, 07h59
  2. [PHP-JS] afficher un ToolTip
    Par tchoukapi dans le forum Langage
    Réponses: 6
    Dernier message: 21/10/2005, 17h44
  3. [Crystal Report] Afficher une image dynamiquement
    Par ntondini dans le forum SAP Crystal Reports
    Réponses: 1
    Dernier message: 09/08/2005, 09h58
  4. [VB.NET] Afficher une image dynamiquement
    Par Sadneth dans le forum ASP.NET
    Réponses: 20
    Dernier message: 07/01/2005, 16h26
  5. AFFICHER UN TABLEAU DYNAMIQUE
    Par ghassenus dans le forum Langage
    Réponses: 2
    Dernier message: 28/12/2002, 14h19

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo