Aller au contenu

Liste déroulante avec affichage d'un tableau


webbzh

Sujets conseillés

Bonjour, je suis un jeune développeur, et j'ai récemment commencé la création d'un site web. cependant, je me retrouve confronté a quelques problèmes, notament l'AJAX...

Je souhaiterais que lorsqu'un membre choisit une date, dans une liste déroulante, il ait le choix dans les lieux des randonnées possibles, pour ensuite voir les inscrits aux randonnées. Comment peut on faire ?J'ai essayé ceci, mais cela ne fonctionne pas, et après avoir cherché pendant des heures, je ne trouve pas comment faire ....


<?php

session_start();

// Non identifié
if(!isset($_SESSION['LOGIN']))
{
$_SESSION['LOGIN']='0';
include('index_refus.html');
exit();
}

// Ajout des menus
if(mb_eregi($_SESSION['LOGIN'],"admin"))
{
include('menuadmin.php');
}
else
{
include('menuprinc.php');
}

if (isset($_POST['nom_cheval']) && isset($_POST['SIRE']))
{
$connexion = mysql_connect("localhost","root","");
if (!$connexion)
{
// Si la connexion à échoué
echo "Erreur: Problème de connexion à la base de données.";
exit();
}
else
{

}
}

?>

<html>
<head>
<title>Liste des inscrits</title>
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
<script type="text/javascript" src="oXHR.js"></script>
<script type="text/javascript">
<!--

function request(oSelect) {
var value = oSelect.options[oSelect.selectedIndex].value;
var xhr = getXMLHttpRequest();

xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
readData(xhr.responseXML);
document.getElementById("loader").style.display = "none";
} else if (xhr.readyState < 4) {
document.getElementById("loader").style.display = "inline";
}
};

xhr.open("POST", "liste_choix.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("IdEditor=" + value);
}

function readData(oData) {
var nodes = oData.getElementsByTagName("item");
var oSelect = document.getElementById("date_rando");
var oOption, oInner;

oSelect.innerHTML = "";
for (var i=0, c=nodes.length; i<c; i++) {
oOption = document.createElement("option");
oInner = document.createTextNode(nodes[i].getAttribute("lieux_rando"));
oOption.value = nodes[i].getAttribute("num_rando");

oOption.appendChild(oInner);
oSelect.appendChild(oOption);
}
}
//-->
</script>
</head>

<body>
<div id="Randonnées">
<p id="Date">
<select id="date_rando" onchange="request(this);">
<option value="none">Selection</option>
<?php
mysql_connect("localhost","root","");
mysql_select_db(CVO);

$query = mysql_query("SELECT * FROM randonnee ORDER BY date_rando");
while ($back = mysql_fetch_assoc($query)) {
echo "\t\t\t\t<option value=\"" . $back["LIEUX_RANDO"] . "\">" . $back["LIEUX_RANDO"] . "</option>\n";
}
?>
</select>
<span id="loader" style="display: none;"><img src="images/loader.gif" alt="loading" /></span>
</p>
<p id="Lieux">
<select id="lieu_rando"></select>
<?php
mysql_connect("localhost","root","");
mysql_select_db(CVO);

$query = mysql_query("SELECT * FROM randonnee WHERE ORDER BY date_rando");
while ($back = mysql_fetch_assoc($query))
{
echo "\t\t\t\t<option value=\"" . $back["NUM_RANDO"] . "\">" . $back["LIEUX_RANDO"] . "</option>\n";
}
?>
</p>
</div>
</body>
</html>

Je vous remercie pour votre aide !

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...