Sujet : Affichage des infos users

Bonjour à tous, je viens vers vous car bien sur j'ai un petit blocage niveau requête AJAX. je vous explique.
j'ai une page profile.php qui affiche les infos du user connecté (session user) et en bas de cette page j'ai généré des boutons affichant les autres users (7) avec du php pour récupérer facilement leurs avatars et leurs nicknames dans ma base de donnée sql.
J'ai crée une autre page contacts.php qui me sert a afficher les infos via les id des autres users en cliquant sur les boutons respectifs.
Seulement voila et vous voyez ou je veux en venir certainement, quand je clique sur ces boutons les infos users s'affichent bien mais sur une autre page alors que je voudrais les afficher sur le même tableau que les infos du user connecté (les remplacer en gros). Donc j'ai écris dans ma page profile.php une requête AJAX que je n'arrive pas a faire fonctionner. Tout du moins elle fonctionne peut-être mais n'est pas pris en compte.....:/ J'ai de gros doute sur la partie "data : "id";" de la requête AJAX et sur le code a insérer dans la partie echo de mes boutons.
Voici le code ajax, le tableau et la partie php de mes boutons :

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>

<script type="text/javascript">
$("#friendslist_button").click(function changeUser(){
    $.ajax({
        type : "GET",
        data : "id";
        url : "contacts.php",
        error: function(msg) {
           alert( "Error !: " + msg ); 
    },
        success: function(data){
           //affiche le contenu du fichier dans le bloc indiqué
           $('#tableau').text(data);
        }
    });
});
</script>
    </head>

<body>

<!-- Tableau -->
<table id="tableau" width="920" bordercolor="FFFFFF"cellspacing="2" cellpadding="15" style="margin-left:15px">
            <tr><span width="10" class="bckg-userprofile">User Profile</span>
            <tr><td width="10" class="profil-color4">User Profile</td>
                <td width="10" class="profil-color4"><?php echo "<img class='bckg_avatar' src='".$row['avatar']."' />"; ?>
            <tr><td width="10" class="profil-color1">Nickname :</td>
                <td width="10" class="profil-color3"><?php echo $row['nickname']; ?>
            <tr><td width="10" class="profil-color1">Name :</td>
                <td width="10" class="profil-color2"><?php echo $row['name']; ?>
            <tr><td width="10" class="profil-color1">Username :</td>
                <td width="10" class="profil-color3"><?php echo $row['username']; ?>
            <tr><td width="10" class="profil-color1">E-mail :</td>
                <td width="10" class="profil-color2"><?php echo $row['email']; ?>
            <tr><td width="10" class="profil-color1">Skype :</td>
                <td width="10" class="profil-color3"><?php echo $row['skype']; ?>
            <tr><td width="10" class="profil-color1">Website :</td>
                <td width="10" class="profil-color2"><?php echo $row['website'];?>
</table>

<!-- Button Friends list -->
    <div id="friendslist_title">Friends list :</div>
        <ul id="friendslist_button" onchange="changeUser(this.value)" class="clearfix">    
<?php
    include ('connection_sql.php');
            $query = " SELECT * FROM users ";  
            $result = mysqli_query($link, $query);
    while ($row = mysqli_fetch_array($result)) {

echo '<a href="contacts.php? id='.$row['id'].'"><img class="bckg_avatar_buttons" width="22" height="22" src="'.$row['avatar'].'">' .$row['nickname']. '</a>';
}
?>
            <tr>
        </ul>

et le code de la page contacts.php

<?php
    if ( isset($_GET['id'])) {
        $id = $_GET['id'];
 
    include ('connection_sql.php');
      //Vérification de la connexion
    if (mysqli_connect_errno()) {
        $texte = 'An error occurred(connect).';
}
    else {
        $query = " SELECT * FROM users WHERE id='$id' "; 
        $result = mysqli_query($link, $query);
 
    while($row = mysqli_fetch_assoc($result)) {
 
      print $row['nickname'] . $row['name'] . $row['username'] . $row['email'] . $row['skype'] . $row['website'] . $row['avatar']; 
    }
  }
}
?>

Merci d'avance pour votre aide
Bertrand

Re : Affichage des infos users

Peut-être qu'un simple

return false;

à la fin de ta fonction évitera que le clic soit propagé au navigateur.

3 Dernière modification par zblteam (08-12-2014 15:51:33)

Re : Affichage des infos users

Bonjour Prélude-prod. pareil  cela affiche les infos sur une autre page.

j'ai refais mon code en version light pour y voir plus clair. Si vous avez une idée de ce qui peut clocher je suis preneur.
d'avance merci.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="styleTest.css" />
    <title>Profile page DONTNOD</title>
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
    </head>
        <body>

<!-- Tableau -->
<div id="div1"></div>

<!-- Button Friends list -->
<a href="contacts.php? id=1" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 1</a>
<a href="contacts.php? id=2" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 2</a>
<a href="contacts.php? id=3" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 3</a>
<a href="contacts.php? id=4" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 4</a>
<a href="contacts.php? id=5" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 5</a>
<a href="contacts.php? id=6" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 6</a>
<a href="contacts.php? id=7" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 7</a>


<script type="text/javascript">
$("friendslist_button").click(function(){
  $.ajax({type :"GET", 
      data :{"id":variableid}, 
      url:"contacts.php", 
      success:function(result){
    $("#div1").html(result);
  }});
}); 
</script>

    </body>
</html>

et ma page contacts.php

<?php
    if (isset($_GET['id'])) {
        $id = $_GET['id'];
        
    include ('connection_sql.php');
      //Vérification de la connexion
    if (mysqli_connect_errno()) {
        $texte = 'An error occurred(connect).';
} 
    else {
        $query = " SELECT * FROM users WHERE id='$id' ";  
        $result = mysqli_query($link, $query);

    while($row = mysqli_fetch_assoc($result)) {

      print $row['nickname'] . $row['name'] . $row['username'] . $row['email'] . $row['skype'] . $row['website'] . $row['avatar'];  
    }
  } 
}
?>

4 Dernière modification par Prélude-Prod (09-12-2014 10:06:27)

Re : Affichage des infos users

Tu places bien le return false ainsi ?

$(".friendslist_button").click(function(){
  $.ajax({type :"GET", 
      data :{"id":variableid}, 
      url:"contacts.php", 
      success:function(result){
           $("#div1").html(result);
        }
    });
 return false;
}); 

N'oublis pas le "." sur ".frienslist_button" pour cibler la class (je suppose que c'est une faute de frappe sur le forum).

Re : Affichage des infos users

Bonjour Prélud-Prod,
merci pour tes tips. j'ai modifié l'appel de l'id et c'est bon j'affiche bien les infos sur la même page. Pas dans le tableau bizarrement (il disparait) alors que l'ajax appelle le div mais je vais chercher pourquoi.
voici le code :

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
    </head>
        <body>

<!-- Tableau -->
<div id="div1">
<table width="920" bordercolor="FFFFFF"cellspacing="2" cellpadding="15" style="margin-left:15px">
            <tr><span width="10" class="bckg-userprofile">User Profile</span>
            <tr><td width="10" class="profil-color4">User Profile</td>
                <td width="10" class="profil-color4"><?php echo "<img class='bckg_avatar' src='".$row['avatar']."' />"; ?>
            <tr><td width="10" class="profil-color1">Nickname :</td>
                <td width="10" class="profil-color3"><?php echo $row['nickname']; ?>
            <tr><td width="10" class="profil-color1">Name :</td>
                <td width="10" class="profil-color2"><?php echo $row['name']; ?>
            <tr><td width="10" class="profil-color1">Username :</td>
                <td width="10" class="profil-color3"><?php echo $row['username']; ?>
            <tr><td width="10" class="profil-color1">E-mail :</td>
                <td width="10" class="profil-color2"><?php echo $row['email']; ?>
            <tr><td width="10" class="profil-color1">Skype :</td>
                <td width="10" class="profil-color3"><?php echo $row['skype']; ?>
            <tr><td width="10" class="profil-color1">Website :</td>
                <td width="10" class="profil-color2"><?php echo $row['website'];?>
</table>
</div>

<!-- Button Friends list --> 
<a href="#" id="1" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 1</a>
<a href="#" id="2" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 2</a>
<a href="#" id="3" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 3</a>
<a href="#" id="4" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 4</a>
<a href="#" id="5" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 5</a>
<a href="#" id="6" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 6</a>
<a href="#" id="7" class="friendslist_button"><img class="friendslist_avatar" src="images/avatar.jpg"> Bouton 7</a>

<script type="text/javascript">
$(".friendslist_button").click(function(){
    var id = $(this).attr('id');
    $.ajax({type :"GET",
    url:"contacts.php?id="+id,
    success:function(result){
    $("#div1").html(result);
    }
  });
return false;
});
</script>