Bonjour,
j'ai un projet de fin d'etude un site web en cour de realisation ,dans la partie administration de ce site dans l'un de ces page je veut afficher 2 select dynamique liee dans l'un qui contient la liste des filiere sporitve(volley ball,judo,foot ball) affichee de la table filiere et l'autre la liste des categorie(minim,cadee,junior,senior) selon le choix de la filiere de la table categorie pour afficher enfin les joueur ou l'entrenneur de cette categorie.
je developpe avec php et sql.
Structure de la table `filiere`
--
CREATE TABLE `filiere` (
`idfil` int(3) NOT NULL auto_increment,
`typefil` varchar(30) NOT NULL,
PRIMARY KEY (`idfil`),
UNIQUE KEY `typefil` (`typefil`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=116 ;
-- Structure de la table `categorie`
--
CREATE TABLE `categorie` (
`idcat` int(3) NOT NULL auto_increment,
`nomcat` varchar(30) NOT NULL,
`typefil` varchar(30) NOT NULL,
PRIMARY KEY (`idcat`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=42 ;
fichier test.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Techniques AJAX - XMLHttpRequest</title>
<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", "XMLHttpRequest_getListData.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("typefil=" + value);
}
function readData(oData) {
var nodes = oData.getElementsByTagName("item");
var oSelect = document.getElementById("softwaresSelect");
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("typefil"));
oOption.value = nodes[i].getAttribute("typefil");
oOption.appendChild(oInner);
oSelect.appendChild(oOption);
}
}
//-->
</script>
</head>
<body>
<fieldset>
<legend>Programmes</legend>
<div id="programBox">
<p id="editors">
<select id="editorsSelect" onchange="request(this);">
<option value="none">Selection</option>
<?php
mysql_connect("localhost","root","");
mysql_select_db("asptt");
$query = mysql_query("SELECT * FROM filiere ORDER BY typefil");
while ($back = mysql_fetch_assoc($query)) {
echo "\t\t\t\t<option value=\"" . $back["typefil"] . "\">" . $back["typefil"] . "</option>\n";
}
?>
</select>
<span id="loader" style="display: none;"><img src="images/loader.gif" alt="loading" /></span>
</p>
<p id="softwares">
<select id="softwaresSelect"></select>
</p>
</div>
</fieldset>
</body>
</html>
fichier XMLHttpRequest_getListData.php :
<?php
header("Content-Type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
echo "<list>";
$typefil = (isset($_POST["typefil"])) ? htmlentities($_POST["typefil"]) : NULL;
if ($typefil) {
mysql_connect("localhost","root","");
mysql_select_db("asptt");
$query = mysql_query("SELECT * FROM categorie WHERE typefil=" . $typefil . " ORDER BY nomcat");
while ($back = mysql_fetch_assoc($query)) {
echo "<item idcat=\"" . $back["idcat"] . "\" nomcat=\"" . $back["nomcat"] . "\" />";
}
}
echo "</list>";
?>
fichier oXHR.js :
function getXMLHttpRequest() {
var xhr = null;
if (window.XMLHttpRequest || window.ActiveXObject) {
if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
} else {
xhr = new XMLHttpRequest();
}
} else {
alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
return null;
}
return xhr;
}
j'espere que j'ai bien expliquer mon probleme ,svp de l'aide et merci d'avance.
cordialement.
Configuration: Windows XP
Safari 525.19
Access lier 2 listes
