[Résolu][JavaScript & jquery] Affichage contenu DIV

Affichage hiérarchique | Affichage linéaire

[Résolu][JavaScript & jquery] Affichage contenu DIV

Auteur Message

tog84
Membre

Messages : 64
Groupe : Membre
Inscription : Jun 2008
Statut : Hors ligne
Réputation : 3

Message : #1

[Résolu][JavaScript & jquery] Affichage contenu DIV

Bonsoir,

Je pensai pouvoir me débrouiller seul avec mon bouquin et les différents forums, mais là je sèche. je fais du sur place depuis une 3 jours.

Voilà mon soucis, j'ai une carte générée automatiquement par une base mysql.
Chaque case est un terrain contenant des informations, notamment la capacité de celui-ci.
En cliquant sur le terrain, un div à coté apparaît avec sa capacité.
Mon bug, c'est que le div affiche la dernière capacité de dernier terrain quelque soit le terrain cliqué.
Je voudrais afficher les infos d'un terrain en cliquant dessus.

STYLES.CSS

Code PHP :

.infos_terrain {
    visibility: hidden;
    width: 200px;
    height: 400px;
    position: absolute;
    background-color: #fff6d0;
    border-style: double;
    margin-left: -220px;
} 

CODE JAVASCRIPT & JQUERY

Code PHP :

function getID(lien){
var separateur = lien.id.split(":");
var pompom = $('#ter_'+separateur[2]).text();
$('.infos_terrain').css("visibility", "visible");
alert("Capacité terrain --> " + pompom );
}; 

BASE TERRAINS

Code PHP :

CREATE TABLE `terrains` (
  `id` mediumint(1) unsigned NOT NULL auto_increment,
  `z_x` mediumint(1) unsigned default '0',
  `z_y` mediumint(1) unsigned default '0',
  `c_x` mediumint(1) unsigned default '0',
  `c_y` mediumint(1) unsigned default '0',
  `type` varchar(20) NOT NULL default '0',
  `capacite` bigint(1) unsigned default '0',
  `estimation` bigint(1) unsigned default '0',
  `base` enum('oui','non') default NULL,
  `id_joueur` int(11) unsigned default '0',
  `img_perso` varchar(50) default '0',
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=4901 DEFAULT CHARSET=latin1; 

INDEX.PHP

Code PHP :

$requete = "SELECT * FROM terrains WHERE z_x='$zone_x' AND z_y='$zone_y'";  //affiche carte
$result_verif_req = F_Verif_Requete($requete); 

Code PHP :

    <div id="terrains">
        <?php
        while ($lignes = mysql_fetch_row($result_verif_req)) 
        {
        $coordonnees = $lignes[1].'-'.$lignes[2].':'.$lignes[3].'-'.$lignes[4].':'.$lignes[0]; //exemple : 1-1:1-1:1
        echo '<img id='.$coordonnees.' onclick="getID(this)" class="img_terrain" src='.'images/'.$lignes[10].' alt='.$lignes[10].'/>';
        echo '<div class="infos_terrain" id="ter_'.$lignes[0].'">';
        echo $lignes[6];
        echo '</div>';
        } 
        ?> 
    </div>    <!--id terrain --!> 

Voici un exemple de ce que génère le PHP :
<img id="1-1:1-1:1" class="img_terrain" alt="mer.png" src="images/mer.png" onclick="getID(this)"/>
<div id="ter_1" class="infos_terrain" style="visibility: visible;">90583977</div>

Comme un visuel vaut mieux qu'un long discours.
Voici un lien de mon site : ici
J'ai mis un alert pour bien voir que chaque terrain renvoie bien sa capacité.

Je vous remercie d'avance pour votre aide.
Cordialement

Ce message a été modifié le: 08-07-2008 01:46 PM par Sephi-Chan.

08-06-2008 09:14 PM

Trouver tous les messages de cet utilisateur

oxman
Membre

Messages : 380
Groupe : Membre
Inscription : May 2008
Statut : Hors ligne
Réputation : 8

Message : #2

RE: [JavaScript & jquery] Affichage contenu DIV

Tu devrais plutôt faire :
$('#ter_'+separateur[2]).css("visibility", "visible");

Enfin si j'ai bien compris le problème.

08-06-2008 09:24 PM

Visiter le site internet de cet utilisateur

Lanwin
Membre

Messages : 77
Groupe : Membre
Inscription : Mar 2008
Statut : Hors ligne
Réputation : 1

Message : #3

RE: [JavaScript & jquery] Affichage contenu DIV

Tu as une map de 7 par 7. Si tu regardes le code source de ta page que tu nous as donné (clique-doit > Afficher la source), tu remarqueras qu'il y a donc 49 <div class="infos_terrain" ...> existantes. Quand tu cliqueras sur un lien, les 49 vont donc s'afficher (puisqu'elles correspondent toutes à la condition que tu donnes ici : $('.infos_terrain').css("visibility", "visible");

Pars donc sur une autre piste. Vu que ces 49 divs ont un ID différent, pourquoi ne pas tenter cela?

Code :

$('#ter_'+ separateur[2]).css("visibility", "visible");

Amicalement,

EDIT : Grillé par Oxman Méssant!

Ce message a été modifié le: 08-06-2008 09:28 PM par Lanwin.

08-06-2008 09:27 PM

oxman
Membre

Messages : 380
Groupe : Membre
Inscription : May 2008
Statut : Hors ligne
Réputation : 8

Message : #4

RE: [JavaScript & jquery] Affichage contenu DIV

Bah toi au moins tu expliquais la raison, moi je ne l'expliquait pas pour voir si il comprenait son erreur d'après la solution

08-06-2008 09:35 PM

tog84
Membre

Messages : 64
Groupe : Membre
Inscription : Jun 2008
Statut : Hors ligne
Réputation : 3

Message : #5

RE: [JavaScript & jquery] Affichage contenu DIV

A force d'avoir le nez dedans j'avais pas remarqué cette erreur.
Oui j'ai très bien compris maintenant

Merci merci beaucoup à vous deux

Ce message a été modifié le: 08-06-2008 09:38 PM par tog84.

08-06-2008 09:35 PM

Mysterarts
Modérateur JeuPHP

Messages : 2,403
Groupe : Modérateur
Inscription : Jan 2007
Statut : Hors ligne
Réputation : 32

Message : #6

RE: [JavaScript & jquery] Affichage contenu DIV

Le tag [Résolu] devant ton titre serait du plus bel effet ! Si si, je t'assure

Mysterarts

Ce message a été modifié le: 08-07-2008 12:40 PM par Mysterarts.

08-07-2008 12:40 PM

tog84
Membre

Messages : 64
Groupe : Membre
Inscription : Jun 2008
Statut : Hors ligne
Réputation : 3

Message : #7

RE: [JavaScript & jquery] Affichage contenu DIV

Mysterarts a écrit :

Le tag [Résolu] devant ton titre serait du plus bel effet ! Si si, je t'assure

Mysterarts

Merci, j'avais complètement oublié

08-07-2008 06:00 PM

« Sujet précédent | Sujet suivant »

Voir une version imprimable
Envoyer ce sujet à un ami
S'abonner au sujet | Ajouter le sujet aux favoris