Une infobulle dynamique qui va chercher infos dans BDD ?

Une infobulle dynamique qui va chercher infos dans BDD ? - PHP - Programmation

Marsh Posté le 24-01-2013 à 13:08:29    

Salut à tous, j'ai posé quelques questions réçemment sur le forum, j'ai trouvé pour la plupart la réponse moi même, mais la, je bloque, malgrès des heures de recherches un peu partout sur le net, je vous explique...
 
J'heberge actuellement un forum PHPBB sur mon site, et sur ce forum j'ai besoin d'une tooltip ( infobulle qui suit la souris pour afficher des informations ), qui m'affiche des données en particulier, données que j'aimerais tirer de ma base de donnée.
 
Voici le code :  
 
<!doctype html>
   
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Tooltip - Track the mouse</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
  <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <style>
  label {
    display: inline-block;
    width: 5em;
  }
  </style>
  <script>
  $(function() {
    $( document ).tooltip({
      track: true
    });
  });
  </script>
</head>
<body>
   
<p><a href="#" title="That's what this widget is">Tooltips</a> can be attached to any element. When you hover
the element with your mouse, the title attribute is displayed in a little box next to the element, just like a native tooltip.</p>
<p>But as it's not a native tooltip, it can be styled. Any themes built with
<a href="http://themeroller.com" title="ThemeRoller: jQuery UI's theme builder application">ThemeRoller</a>
will also style tooltips accordingly.</p>
<p>Tooltips are also useful for form elements, to show some additional information in the context of each field.</p>
<p><label for="age">Your age:</label><input id="age" title="We ask for your age only for statistical purposes." /></p>
<p>Hover the field to see the tooltip.</p>
   
   
</body>
</html>
 
 
J'ai donc ma tooltip, qui fonctionne comme je le souhaite, et je l'ai donc trouvée sur google.
 
Mon problème à l'heure actuelle c'est que la tooltip n'est pas "dynamique" elle affiche une phrase qui est directement écrite dans le code joint ci dessus.( En gras )
 
Ma question ? Est il possible de remplacer cette phrase déjà écrite par des termes qui sortiraient tout droit de la base de donnée ? Une sorte de requête qui irait chercher des informations, par exemple si je lui dit que je veux les informations de l'objet portant l'ID 30540, qu'elle me sorte l'image de l'objet ainsi que le descriptif, le tout dans l'infobulle.
 
Mais la je bloque, pourquoi ? Parce que je suppose que je devrais intégrer un code PHP et une requête MYSQL la dedans, hors, je passe par le BBcode du forum PHPBB, je ne sais donc pas si on peut intégrer la dedans du PHP, pour faire la fameuse requête MYSQL. Vous me suivez ?
 
Car à part cette solution, je ne vois vraiment pas comment je vais pouvoir faire pour faire ma tooltip "dynamique".
 
Si vous avez besoin de plus d'informations n'hésitez pas.
 
Merci d'avance,
 
Cordialement.


Message édité par Ametsu le 24-01-2013 à 13:09:37
Reply

Marsh Posté le 24-01-2013 à 13:08:29   

Reply

Marsh Posté le 24-01-2013 à 16:34:56    

Bonjour,
Vous savez que les smartphones, tablettes... sont de plus en plus présent. Avez-vous pensé à l'accessibilité avec ce genre de fonctionnalités?


---------------
Besoin d'aide pour votre projet? agence web
Reply

Marsh Posté le 24-01-2013 à 16:53:37    

Hello Ametsu.

 

Ce que tu dois faire: définir au dessus de quel élément tu es, et demander au serveur le contenu de la tooltip.

 

En détail:

 

- Récupérer un identifiant de l'élément survolé.  Cela se fait en javascript vie un mécanisme propre à jquery que je ne connais pas et que je te laisse chercher.
- En javascript toujours, faire une requête ajax. Jquery propose des classe permettant de les faire simplement: http://api.jquery.com/jQuery.ajax/
- Cette requete va envoyer l'identifiant à un serveur php, qui va faire la requete sql. Ce code php n'est pas intégré à phpbb. Il tourne à côté de manière indépendante, ou même sur une autre serveur à l'autre bout du monde, cela n'importe pas. Ce code php retourne le contenu de la tooltip.
- Dans la callback de cette requete ajax (en javascript donc), récupérer le contenu de la tooltip et placer son contenu dans la page via jquery.

 

Voila en gros, je ne peux pas être plus précis, ne connaissant pas jquery.


Message édité par gelatine_velue le 24-01-2013 à 16:53:52
Reply

Marsh Posté le 06-02-2013 à 02:08:02    

Désolé pour le retard :) ! Merci beaucoup à toi, grace à ton message j'ai pu me rapprocher du coeur du problème, et y mettre bientôt fin !

Reply

Marsh Posté le 16-04-2013 à 14:39:26    

Ametsu a écrit :

Désolé pour le retard :) ! Merci beaucoup à toi, grace à ton message j'ai pu me rapprocher du coeur du problème, et y mettre bientôt fin !



Je recherche exactement ça  :ange:  
Peux tu partager ta trouvaille stp.  
Je patauge  dans la semoule et cela m'aiderai considérablement
 
Par avance MERCI :hello:  

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed