rafraichir un <div> avec le fiche d'un membre

**aoso33** · 13/09/2009, 16h24

Bonjour à tous,

Je suis pas un boss de la programmation web mais je pratique autant que je peux... et je me confronte aux problèmes : c'est pas mal pour apprendre !

Alors voici ce que je voudrais faire : ma page est composée d'un tableau. Dans un colonne (A) j'ai différents noms et dans une autre case (B) du tableau s'affiche les informations concernant les différentes personnes nommées auparavant.
A l'ouverture de la page j'aimerai que la fiche d'une personne au hasard apparaisse en case B pour cela j'ai fait comme ça :

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
<tr>
       <td height="30px" align="center" background="/img/bgtitre.jpg" colspan="3">
	       <font face="Comic Sans MS">
		       Le point sur...
               </font>
	</td>
</tr>
<tr>
       <td>
	       <div id="fichemembre">
		       <?php $chiffre=rand(1,45); 
                                 include 'membres/'.$chiffre.'.php'; ?>
		</div>
	</td>
</tr>

Puis une fois sur la page, j'aimerai qu'en cliquant sur le nom d'une personne en colonne A on affiche sa fiche en case B.
Comme vous l'aurez compris il y a dans mon exemple 45 membres et donc 45 fiches nommées de 1.php à 45.php.

Comment faire pour qu'au clic sur un nom je puisse recharger le <div> et y afficher la fiche voulue ?

Merci d'avance

**PapyWeb** · 13/09/2009, 22h37

Bonjour,

Je ne vois pas de JavaScript, mais du PHP.

Ton problème se résoudrait bien avec Ajax mais si tu ne connais pas, il y a plus court.

Au point où tu en es, ta liste de membres pourrait être dans un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<form >
<select onchange="window.location.href="+this.value+".php">
  <option value="1">Arthur</option>
  <option value="2">Babar</option>
...
  <option value="45">Zorglub</option>
</select>
</form>

1.php s'occupant de l'affichage de la page et du <select>

C'est une possibilité parmi des centaines.

Rappelons-nous que l'appel type à un programme php est "fiche.php?id=3".
Dans "fiche.php" la variable $_GET['id'] vaut dans ce cas 3, et tu te débrouilles.

*************************************************************************
Plus généralement,
1) Ne pas utiliser de div dans des tables.
Sans <table> faire <div id="details"> avec dans le <head> :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<style>
  #details{ position:absolute; top:0px; left:120px;
...
}
</style>

ou alors
Dans <table>, faire <td id="details"> mais sans div.

2) il y a la même différence entre nombre et chiffre qu'entre mot et lettre.

*************************************************************************
Bon courage !

**aoso33** · 14/09/2009, 00h17

Bonjour,

Au point où tu en es, ta liste de membres pourrait être dans un
<form >
<select onchange="window.location.href="+this.value+".php">
<option value="1">Arthur</option>
...
<option value="45">Zorglub</option>
</select>
</form>

Cela me gène un petit peu dans la mesure où il y aussi une utilité à ce que la liste des membres soit affichée. (c'est un détail mais bon)

Plus généralement,
1) Ne pas utiliser de div dans des tables.

Dans <table>, faire <td id="details"> mais sans div.

ok, je change ça tout de suite !

2) il y a la même différence entre nombre et chiffre qu'entre mot et lettre.

c'est vrai, bien vu ! je change donc mon nom de variable immédiatement

ne pourrais-je pas avoir recours à l'evenement Onclick ?
Mais dans ce cas comment passer le numéro du membre pour charger le fichier ?
Et comment ne rafraichir qu'une partie de ma page ?
Merci

**SpaceFrog** · 14/09/2009, 09h04

préconiser un frame

Ajax n'a rien de sorcier, je te conseille vivement de jeter un oeil sur les tutos proposés sur le forum.

**Darkroro** · 14/09/2009, 10h00

il y a beaucoup de manière de faire ce que tu souhaites, faut juste que tu réfléchisses aux contraintes que tu as et si tu souhaites optimiser ton script ou pas... est-ce que tu veux une "usine à gaz" (façon de parler) qui va te permettre une fois développé d' ajouter/enlever des fiches sans devoir retoucher le code par exemple (ajouter/enlever un lien dans la liste) ? pourquoi créer un fichier par fiche (t'as pensé à la base de données ou au fichier xml ?) bon tout ça ne te donne pas de solution, c'est mon défaut de concepteur...

si tu cherches juste un truc simple mais que tu veux absolument ne rafraichir qu'une partie de la page, jette un oeil sur AJAX comme dit SpaceFrog, c'est vraiment pas compliqué...

ça va te permettre d'interroger la fiche qui t'intéresse, d'en récupérer le contenu et de l'afficher dans ta colonne B grâce à la propriété innerHTML...

rafraichir un <div> avec le fiche d'un membre

JavaScript

Discussions similaires

Partager

Partager