[MongoDB][Express]Construire un tableau html à partir d'une requête AJAX

Bonjour,

je souhaite m'initier (fortement) à Node.js, pour ce faire j'essaie de développer un petit jeu (après avoir suivis 2 tutoriels). Pour le moment, le joueur (moi!) peut se connecter, si la connexion est réussie, il est renvoyé sur une page 'personnages.ejs' affichant le nom du joueur ainsi qu'une liste des personnage qu'il dispose. Attention, le problème: son nom ne s'affiche pas ainsi que le tableau des personnages.

Pour une meilleure représentation:
Pièce jointe 449784

Le nom du joueur est censé apparaître à droite de 'Bienvenue'.

Les codes:
-données renvoyées par la fonction de connexion:

Code:

1
2
3
4
5
6
7
8
 
joueurs.findOne({"identifiant":identifiant,"mdp":mdp},{},function(err,doc){
  if (err){
    res.setDefaultEncoding("Erreur de connexion:" + err);
  } else {
    res.render('personnages',{joueur:doc});
  }
 });

-La page.ejs:

Code:

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
 
<!DOCTYPE html>
<html>
  <head>
    <title>Personnages</title>
    <link rel='stylesheet' href='/stylesheets/style.css'>
  </head>
  <body>
    <div id="header">
      <input id="joueurId" value="<% joueur._id %>" type="hidden">
      Bienvenue <% joueur.identifiant %>
    </div>
    <div id="listePersonnage">
      <h1>Mes personnages:</h1>
      <table>
        <thead>
          <tr>
            <td>Nom</td>
            <td>Statut</td>
            <td>Delete ?</td>
          </tr>
        </thead>
        <tbody>
 
        </tbody>
      </table>
    </div>
    <div id="infoPersonnage">
 
    </div>
    <div id="nouveauPersonnage">
 
    </div>
    <script src='javascripts/personnages.js'></script>
  </body>
</html>

-Le fichier personnages.js:

Code:

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
 
var listePersonnage = [];
 
$(document).ready(function(){
  trouverPersonnagesJoueur();
});
 
/* FUNCTIONS ========================================== */
 
function trouverPersonnagesJoueur(){
  var id = document.getElementById('joueurId').value;
  $.getJSON('/listePersonnages',{'joueurId':id}, function(data){
    listePersonnage = data;
 
    var ligneTableau = "";
 
    $.each(data, function(){
      ligneTableau += '<tr>';
      ligneTableau += '<td><a href="#" class="lienMontrerPersonnage" rel="'+this._id+'">'+this.nomPersonnage+'</a></td>';
      ligneTableau += '<td>'+this.statutPersonnage+'</td>';
      ligneTableau += '<td><a href="#" class="lieSupprimerPersonnage" rel"'+this._id+'">Oui</a></td>';
      ligneTableau += '</tr>';
    });
    $('#listePersonnage table tbody').html(ligneTableau);
  });
};

-La fonction appelé via AJAX:

Code:

1
2
3
4
5
6
7
8
9
 
/* Liste des personnages d'un joueur */
router.get('/listePersonnages', function(req,res){
  var db = req.db;
  var collection = db.get('personnages');
  collection.find({'joueurId':joueurId},{}, function(e,docs){
    res.json(docs);
  });
});

En espérant que mon code ne soit pas miné de fautes! Je précise qu'aucune erreur ne s'affiche dans la console.
Ma patiente à une limite et je l'ai repoussé toute la journée :mur:.

Merci de vos réponses,
Skunka.