3 listes déroulantes liées
Posté : 11 oct. 2006, 22:10
Bonsoir; je voulais créer deux listes déroulantes ( pays et villes ) l'une liée à l'autre et j'ai réussi à le faire graçe à un code javascript; maintenant je veux ajouter une 3ieme liste déroulante ( régions ) liée à ( villes ); ça fait 3 jours que j'essaie en vain, pouvez-vous m'aider ?
index.php
index.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- saved from url=(0014)about:internet -->
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css">
<title>:: LACENTRALE IMMOBILIERE ::</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!--Fireworks 8 Dreamweaver 8 target. Created Mon Oct 31 13:28:32 GMT+0000 (Greenwich) 2005-->
<style type="text/css">
<!--
body {
background-color: #F49902;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
.style2 {FONT-FAMILY:Tahoma; COLOR: #ECC600; font-size: 11px;}
.style1 {color: #FFFFFF}
.Style4 {FONT-FAMILY: Tahoma; COLOR: #ECC600; font-size: 11px; font-weight: bold; }
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
color: #ED9F01;
}
a:active {
text-decoration: none;
}
-->
</style>
<script type='text/javascript'>
var xhr = null;
function getXhr(){
if(window.XMLHttpRequest) // Firefox et autres
xhr = new XMLHttpRequest();
else if(window.ActiveXObject){ // Internet Explorer
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
}
/**
* Méthode qui sera appelée sur le click du bouton
*/
function affich(){
getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('subville').innerHTML = leselect;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","ajaxville.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('pays');
idpays = sel.options[sel.selectedIndex].value;
xhr.send("idPays="+idpays);
}
</script>
</head>
<body>
<table width="785" border="0" align="center" cellpadding="0" cellspacing="0">
<!-- fwtable fwsrc="charte1.png" fwbase="index.jpg" fwstyle="Dreamweaver" fwdocid = "742308039" fwnested="0" -->
<tr>
<td><img src="images/spacer.gif" width="12" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="12" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="14" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="118" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="16" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="49" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="50" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="61" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="407" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="28" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="17" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
</tr>
<tr>
<td colspan="12"><img name="index_r1_c1" src="images/index_r1_c1.jpg" width="785" height="4" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="4" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="4" colspan="3"><img name="index_r2_c1" src="images/index_r2_c1.jpg" width="38" height="71" border="0" alt=""></td>
<td rowspan="3" colspan="4"><img name="index_r2_c4" src="images/index_r2_c4.jpg" width="184" height="68" border="0" alt=""></td>
<td colspan="5"><img name="index_r2_c8" src="images/index_r2_c8.jpg" width="563" height="5" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="5" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="3"><img name="index_r3_c8" src="images/index_r3_c8.jpg" width="50" height="66" border="0" alt=""></td>
<td colspan="2"><img name="index_r3_c9" src="images/CIH.gif" width="468" height="60" border="0" alt=""></td>
<td rowspan="3" colspan="2"><img name="index_r3_c11" src="images/index_r3_c11.jpg" width="45" height="66" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="60" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="2" colspan="2"><img name="index_r4_c9" src="images/index_r4_c9.jpg" width="468" height="6" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="3" border="0" alt=""></td>
</tr>
<tr>
<td colspan="4"><img name="index_r5_c4" src="images/index_r5_c4.jpg" width="184" height="3" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="3" border="0" alt=""></td>
</tr>
<tr>
<td colspan="12" background="images/index_r6_c1.jpg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="39%"> </td>
<td width="57%" class="txt11"><div align="center"><a href="index.php" class="txt11">Home</a>
| <a href="presentation.php" class="txt11">Qui sommes-nous</a> |
<a href="ContactPub.php" class="txt11">Contact & Publicité</a>
| <a href="abonnement.php" class="txt11">S'abonner</a> | <a href="favoris.php" class="txt11">Favoris</a></div></td>
<td width="4%"> </td>
</tr>
</table></td>
<td><img src="images/spacer.gif" width="1" height="36" border="0" alt=""></td>
</tr>
<tr>
<td colspan="12"><img name="index_r7_c1" src="images/index_r7_c1.jpg" width="785" height="9" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="9" border="0" alt=""></td>
</tr>
<tr>
<td colspan="5"><img name="index_r8_c1" src="images/index_r8_c1.jpg" width="172" height="10" border="0" alt=""></td>
<td colspan="6" rowspan="10" bgcolor="#BC1B2B"><table width="596" height="135" border="0" cellpadding="0" cellspacing="0">
<form name="form" method="post" action="result1.php">
<tr>
<td height="12" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="12" height="12" valign="top"><img src="img-/coin1.jpg"></td>
<td><div align="right">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="txt11"><label> </label> <label> </label>
<input name="radionchk1" type="radio" value="0" checked>
Offres
<label>
<input name="radionchk1" type="radio" value="1">
Demandes</label></td>
<td width="240" class="txt10"><div align="right"><span class="txt11">
<? include("gestion/config.php");
$sql="select * from achat ";
$res = mysql_query($sql) or die('Erreur SQL !<br />'.$sql.'<br />'.mysql_error());
$total = mysql_num_rows($res);
echo"$total Annonces Actuellement";
?>
</span> </div></td>
</tr>
</table>
</div></td>
<td> </td>
<td width="12" align="right" valign="top"><img src="img-/coin2.jpg" width="12" height="12"></td>
</tr>
</table></td>
</tr>
<tr>
<td valign="middle"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="30" valign="top"><img src="images/charte1_r10_c7.jpg" width="160" height="20"></td>
</tr>
<tr>
<td valign="middle"><table width="100%" border="0" cellpadding="0" cellspacing="0" >
<tr>
<td> <table width="100%" border="0" cellpadding="0" cellspacing="0" class="txt11">
<tr>
<td><input name="radionchk" type="radio" value="0" checked class="Textzone"></td>
<td>Vente</td>
</tr>
<tr>
<td><input name="radionchk" type="radio" value="1" class="Textzone"></td>
<td>Location</td>
</tr>
</table></td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0" class="txt11">
<tr>
<td width="43%">Pays</td>
<td><select name='pays' id='pays' class="txt1" onChange='affich()'>
<option value='0'>Sélectionner</option>
<?
mysql_connect("localhost","root","");
mysql_select_db("immo_bd");
$res = mysql_query("SELECT * FROM pays ORDER BY nom");
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row["id"]."'>".$row["nom"]."</option>";
}
?>
</select> </td>
</tr>
<tr>
<td>Ville</td>
<td>
<div id='subville' style='display:inline'>
<select name='sub_ville' id='ville' class="txt1">
<option value='0'>Sélectionner</option>
</select>
</div></td>
</tr>
<tr>
<td></td>
<td></div>
<? echo "<select name='details' class='txt1' >";
mysql_connect("localhost","root","");
mysql_select_db("immo_bd");
$sub_ville = $_POST['sub_ville'];
$res = mysql_query("SELECT DISTINCT Ville FROM details
WHERE Ville='".$sub_ville."'");
echo "<option value='0'>Aucune</option>";
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row["Ville"]."'>".$row["Ville"]."</option>";
}
echo "</select>";
echo $sub_ville;
?>
</td>
</tr>
</table></td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0" class="txt11">
<tr>
<td>NB Pièces</td>
<td><select name="sub_type_logement" class="txt1">
<option value="0">Sélectionnez</option>
<?
$select2 = mysql_query("select * from logement");
while ($row = mysql_fetch_array($select2))
{
$sub_type_logement = $row["type_logement"];
echo"<option value=\"$sub_type_logement\">";
echo"$sub_type_logement";
echo"</option>";
}
?>
<option value="0">Autres</option>
</select></td>
</tr>
<tr>
<td height="20">Meublé</td>
<td><select name="meublier" class="txt1">
<option value="0">Sélectionnez</option>
<?
$select2 = mysql_query("select * from meublier");
while ($row = mysql_fetch_array($select2))
{
$meuble = $row["meuble"];
echo"<option value=\"$meuble\">";
echo"$meuble";
echo"</option>";
}
?>
</select></td>
</tr>
<tr>
<td> <div align="left">Type de bien</div></td>
<td><select name="sub_type_achat" class="txt1">
<option value="0">Sélectionnez</option>
<?
$select = mysql_query("select * from typeachat");
while ($row = mysql_fetch_array($select))
{
$type_achat = $row["type_achat"];
echo"<option value=\"$type_achat\">";
echo"$type_achat";
echo"</option>";
}
?>
</select></td>
</tr>
</table>
<div align="right"></div></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td height="12" valign="bottom"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="12" height="12" valign="bottom"><img src="img-/coin3.jpg"></td>
<td width="551" align="center" valign="middle"><div align="right" class="style1"><img src="img-/trouv.jpg" width="82" height="20" onClick="form.submit()"></div></td>
<td width="33" align="right" valign="bottom"><img src="img-/coin4.jpg" width="12" height="12"></td>
</tr>
</table></td>
</tr>
</form>
</table></td>
<td rowspan="16"><img name="index_r8_c12" src="images/index_r8_c12.jpg" width="17" height="404" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="10" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="15"><img name="index_r9_c1" src="images/index_r9_c1.jpg" width="12" height="394" border="0" alt=""></td>
<td rowspan="2" colspan="3"><img name="index_r9_c2" src="images/index_r9_c2.jpg" width="144" height="24" border="0" alt=""></td>
<td rowspan="15"><img name="index_r9_c5" src="images/index_r9_c5.jpg" width="16" height="394" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="20" border="0" alt=""></td>
</tr>
<tr>
<td><img src="images/spacer.gif" width="1" height="4" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><img name="index_r11_c2" src="images/index_r11_c2.jpg" width="144" height="4" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="4" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><a href="passannonce.php"><img name="index_r12_c2" src="images/index_r12_c2.jpg" width="144" height="16" border="0" alt=""></a></td>
<td><img src="images/spacer.gif" width="1" height="16" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><img name="index_r13_c2" src="images/index_r13_c2.jpg" width="144" height="4" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="4" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><a href="index.php"><img name="index_r14_c2" src="images/index_r14_c2.jpg" width="144" height="17" border="0" alt=""></a></td>
<td><img src="images/spacer.gif" width="1" height="17" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><img name="index_r15_c2" src="images/index_r15_c2.jpg" width="144" height="5" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="5" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><img name="index_r16_c2" src="images/index_r16_c2.jpg" width="144" height="22" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="22" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3" rowspan="2" bgcolor="#BC1B2B"><span class="txt11"> <img src="images/fleche.gif" width="9" height="10"> <a href="conseils.php" class="txt11">NOS CONSEILS</a></span><BR>
<span class="txt11"><img src="images/fleche.gif" width="9" height="10"> <a href="partenaires.php" class="txt11">NOS PARTENAIRES</a></span></td>
<td><img src="images/spacer.gif" width="1" height="33" border="0" alt=""></td>
</tr>
<tr>
<td colspan="6"><img name="index_r18_c6" src="images/index_r18_c6.jpg" width="596" height="8" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="8" border="0" alt=""></td>
</tr>
<tr>
<td><img name="index_r19_c2" src="images/index_r19_c2.jpg" width="12" height="70" border="0" alt=""></td>
<td colspan="2" bgcolor="#BC1B2B"><a href="architectes.php" class="style2">Architectes</a><br>
<a href="promoteurs.php" class="style2">Promoteurs</a><br>
<a href="bureauordre.php" class="style2">Bureaux d'études</a><br>
<a href="topographes.php" class="style2">Géomètres/Topographes</a><br>
<a href="notaires.php" class="style2"> Notaires</a></td>
<td rowspan="4" colspan="6"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="422" height="251">
<param name="movie" value="images/banniere.swf">
<param name="quality" value="high">
<embed src="images/banniere.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="422" height="251"></embed>
</object>
<a href="http://www.philips.fr" target="_blank">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="174" height="251">
<param name="movie" value="images/bancih.swf">
<param name="quality" value="high">
<embed src="images/bancih.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="174" height="251"></embed>
</object>
</a></td>
<td><img src="images/spacer.gif" width="1" height="70" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><a href="Reactions.php"><img name="index_r20_c2" src="images/index_r20_c2.jpg" width="144" height="69" border="0" alt=""></a></td>
<td><img src="images/spacer.gif" width="1" height="69" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="144" height="96">
<param name="movie" value="images/bancentral.swf">
<param name="quality" value="high">
<embed src="images/bancentral.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="144" height="96"></embed>
</object></td>
<td><img src="images/spacer.gif" width="1" height="96" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="2" colspan="3"><img name="index_r22_c2" src="images/index_r22_c2.jpg" width="144" height="26" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="16" border="0" alt=""></td>
</tr>
<tr>
<td colspan="6"><img name="index_r23_c6" src="images/index_r23_c6.jpg" width="596" height="10" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="10" border="0" alt=""></td>
</tr>
<tr>
<td colspan="12"><img name="index_r24_c1" src="images/index_r24_c1.jpg" width="785" height="20" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="20" border="0" alt=""></td>
</tr>
<tr>
<td colspan="12"><img name="index_r25_c1" src="images/index_r25_c1.jpg" width="785" height="1" border="0" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
</tr>
</table>
</body>
</html>
ajaxvilles.php<?php
echo "<select name='sub_ville' class='txt1' >";
if(isset($_POST["idPays"])){
mysql_connect("localhost","root","");
mysql_select_db("immo_bd");
$res = mysql_query("SELECT DISTINCT titre FROM villes
WHERE idPays=".$_POST["idPays"]." ORDER BY titre");
echo "<option value='0'>Aucune</option>";
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row["titre"]."'>".$row["titre"]."</option>";
}
echo "</select>";
}
?>
Base de données :CREATE TABLE `pays` (
`nom` varchar(50) NOT NULL default '',
`id` tinyint(4) NOT NULL default '0',
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
--
-- Contenu de la table `pays`
--
INSERT INTO `pays` VALUES ('France', 2);
INSERT INTO `pays` VALUES ('Maroc', 1);
CREATE TABLE `villes` (
`id` tinyint(4) NOT NULL auto_increment,
`titre` varchar(50) NOT NULL default '',
`idPays` tinyint(4) default NULL,
`details` varchar(50) NOT NULL default '',
`verif` tinyint(4) NOT NULL default '0',
PRIMARY KEY (`id`)
) ;
--
-- Contenu de la table `villes`
--
INSERT INTO `villes` VALUES (1, 'CASABLANCA', 1, '', 0);
INSERT INTO `villes` VALUES (2, 'RABAT', 1, '', 0);
INSERT INTO `villes` VALUES (3, 'FES', 1, '', 0);
INSERT INTO `villes` VALUES (4, 'PARIS', 2, '', 0);
INSERT INTO `villes` VALUES (5, 'ILE DE FRANCE', 2, 'Moise', 1);
INSERT INTO `villes` VALUES (6, 'PROVINCES', 2, '01', 2);
INSERT INTO `villes` VALUES (7, 'ILE DE FRANCE', 2, 'VAL MARNE', 1);
INSERT INTO `villes` VALUES (8, 'ILE DE FRANCE', 2, 'ESSONE', 1);
INSERT INTO `villes` VALUES (9, 'PROVINCES', 2, '01', 2);
INSERT INTO `villes` VALUES (10, 'PROVINCES', 2, '02', 2);
CREATE TABLE `details` (
`id` tinyint(4) NOT NULL auto_increment,
`plus` varchar(50) NOT NULL default '',
`idVille` tinyint(4) default NULL,
`verif` tinyint(4) default NULL,
`Ville` varchar(50) NOT NULL default '',
PRIMARY KEY (`id`)
) ;
--
-- Contenu de la table `details`
--
INSERT INTO `details` VALUES (1, 'ESSONES', 5, 1, 'ILE DE FRANCE');
INSERT INTO `details` VALUES (2, 'VAL OISE', 5, 1, 'ILE DE FRANCE');
INSERT INTO `details` VALUES (3, '01', 6, 2, 'PROVINCES');
INSERT INTO `details` VALUES (4, '02', 6, 2, 'PROVINCES');
INSERT INTO `details` VALUES (5, '03', 6, 2, 'PROVINCES');
INSERT INTO `details` VALUES (6, 'MOISE', 5, 1, 'ILE DE FRANCE');