Une fenêtre ajax ouverte sur le click du nom de l’exposant cela n’irait pas ?
tu peux m’en dire plus sur ton Idée.
Il s’agit lors de l’affichage de la page (événement domReady) d’associer à chaque element <li id=’xx’> un évenement de type ’click’ qui déclenche un appel XmlHttpRequest (ajax) sur le server pour lire la fiche correspondante.
A titre d’exemple voici très simplifié comment pourrait fonctionner ce code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript">
window.addEvent('domready', function(){
lis = $$("#memberlist li");
for(i=0;i<lis.length;i++){
li = lis[i];
li.addEvent('click', function(e) {
e = new Event(e).stop();
var url = "showMembers.php";
var pars = Object.toQueryString({
q: url,
id: this.id
});
new Ajax(url, { postBody: pars, update: $('fiche') }).request();
});
}
});
</script>
</head>
<body>
<h3>Liste des exposants :</h3>
<div id='fiche'></div>
<ul id="memberlist">
<li id='23'><a href="#">Pierre Ponce</a></li>
<li id='37'><a href="#">Jean Bonneau</a></li>
<li id='41'><a href="#">Melusine Enfaillite</a></li>
<li id='48'><a href="#">Paul Ochon</a></li>
</ul>
</body>
</html>
avec showMembers.php:
<?php
$id = $_POST['id'];
$expo = array(
23 => array('country' => 'France', 'fullname' => 'Pierre Ponce', 'email' => '[email protected]', 'phone' => '01 43 78 25 32', 'comment' => 'perfumer'),
37 => array('country' => 'France', 'fullname' => 'Jean Bonneau', 'email' => '[email protected]', 'phone' => '05 43 88 55 32', 'comment' => 'butcher'),
41 => array('country' => 'France', 'fullname' => 'Melusine Enfaillite', 'email' => '[email protected]', 'phone' => '04 43 28 25 32', 'comment' => 'boss'),
48 => array('country' => 'France', 'fullname' => 'Paul Ochon', 'email' => '[email protected]', 'phone' => '02 43 78 55 81', 'comment' => 'clothes')
);
echo "<span> Country: {$expo[$id]['country']} Full name: {$expo[$id]['fullname']} Email: {$expo[$id]['email']} Phone: {$expo[$id]['phone']} Comment: {$expo[$id]['comment']} </span>";
?>Bien sûr showMembers.php est très simple et doit remplacé par l’appel à la lecture de fiche. De plus avec les bons styles css, tu peux afficher la fiche (<div id="fiche"></div>en incrusté (relative) ou en overlap (absolute). Et rajouter un lien de type "fermer" pour faire disparaitre la fiche.
Ci-joint le code de démo. A tester en local :
http://localhost/showMembers.html
