Case à cocher et liste déroulante
liloo
-
liloo -
liloo -
Bonjour,
Voilà, j'ai réalisé une liste à checkbox (4 choix) qui propose des types d'hébergements:
- locations de vacances
- locations mensuelles
- ventes immobilières
- hotels-campings
...et une liste déroulante en dessous qui affichera le type de biens en fonction du choix qui aura été fait.
Par exemple, si je coche la case "locations de vacances" dans le menu déroulant j'aurais "appartement", "maison"...tandis que si je clique sur "hotels-camping" j'aurais "mobil home", "chambre d'hotels"...
Comme vous l'avez peut-être déjà compris, ce que je souhaiterais, c'est que, lorsqu'une case est cochée, la liste déroulante en dessous affiche les options (autrement dit les types de biens) propres à cette case, sachant en plus que les données concernant les types de biens sont à aller chercher dans une base de données.
Pouvez-vous m'expliquer juste comment procéder, j'ai quelques notions des javascript, php, et sql mais pas assez pour me dépatouiller de ce problème.
Merci à l'avance pour vos réponses ^^
Voilà, j'ai réalisé une liste à checkbox (4 choix) qui propose des types d'hébergements:
- locations de vacances
- locations mensuelles
- ventes immobilières
- hotels-campings
...et une liste déroulante en dessous qui affichera le type de biens en fonction du choix qui aura été fait.
Par exemple, si je coche la case "locations de vacances" dans le menu déroulant j'aurais "appartement", "maison"...tandis que si je clique sur "hotels-camping" j'aurais "mobil home", "chambre d'hotels"...
Comme vous l'avez peut-être déjà compris, ce que je souhaiterais, c'est que, lorsqu'une case est cochée, la liste déroulante en dessous affiche les options (autrement dit les types de biens) propres à cette case, sachant en plus que les données concernant les types de biens sont à aller chercher dans une base de données.
Pouvez-vous m'expliquer juste comment procéder, j'ai quelques notions des javascript, php, et sql mais pas assez pour me dépatouiller de ce problème.
Merci à l'avance pour vos réponses ^^
A voir également:
- Case à cocher et liste déroulante
- Liste déroulante excel - Guide
- Liste déroulante en cascade - Guide
- Supprimer case à cocher excel ✓ - Forum Excel
- Case à cocher excel ✓ - Forum Excel
- Supprimer des cases à cocher (Excel 2003) - Forum Excel
3 réponses
bonjour
voila un petit exemple de ce que tu veux
il ne te reste plus qu'a remplacer les liste de type de logement en les separant bien par un point virgule ; :)
Adns
voila un petit exemple de ce que tu veux
<script>
function list(liste,y){
var phrase = liste;
var vecteur = phrase.split(";");
var text = "<select>";
for (i = 0; i<y; i++){
text+='<option value='+vecteur[i]+'>'+vecteur[i]+'</option>';
}
text+="</select>"
document.getElementById(5).innerHTML = text;
}
function disable(y){
for (var i=1; i<=4; i++) {
if (i!=y){
document.getElementById(i).checked=false;
}
}
}
</script>
<input type="checkbox" onclick="list('appart;maison;tente;camping',4);disable(1);" id="1">- locations de vacances
<input type="checkbox" onclick="list('appart;maison',2);disable(2);" id="2">- locations mensuelles
<input type="checkbox" onclick="list('appart;maison;villa;chalet',4);disable(3);" id="3">- ventes immobilières
<input type="checkbox" onclick="list('chambre;chalet;caravane;tente;camping',5);disable(4);" id="4">- hotels-campings
<div id="5"></div>
il ne te reste plus qu'a remplacer les liste de type de logement en les separant bien par un point virgule ; :)
Adns
hihi je revien en force! juste une petite kestion adns (avant de mettre sujet résolu^^); dans le code que tu m'as donné comment tu peut aligner ta liste déroulante qui apparaît avec la liste à checkbox pour que ça soit plus esthétik ? ? ? Merci!!
Je remets le code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="index.css" rel="stylesheet" type="text/css" />
<title>Document sans nom</title>
<script>
function list(liste,y){
var phrase = liste;
var vecteur = phrase.split(";");
var text = "<select>";
for (i = 0; i<y; i++){
text+='<option value='+vecteur[i]+'>'+vecteur[i]+'</option>';
}
text+="</select>"
document.getElementById(5).innerHTML = text;
}
function disable(y){
for (var i=1; i<=4; i++) {
if (i!=y){
document.getElementById(i).checked=false;
}
}
}
</script>
</head>
<body bgcolor="#000000">
<div id="check">
<ul>
<li class="intitule">Choisissez un type d'hébergement</li><br />
<li class="choix"><input type="checkbox" onclick="list('Appartement;Maison;Terrain;Local comercial',4);disable(1);" id="1">Locations saisonnières</li>
<li class="choix"><input type="checkbox" onclick="list('Appartement;Maison',2);disable(2);" id="2">Locations mensuelles</li>
<li class="choix"><input type="checkbox" onclick="list('Appartement;Maison;Terrain;Local commercial',4);disable(3);" id="3">Ventes immobilières</li>
<li class="choix"><input type="checkbox" onclick="list('Mobil home;emplacement;caravane;gîte;hôtel',5);disable(4);" id="4">Hôtels-Campings</li>
</ul>
<div id="5"></div>
</div>
</body>
</html>
Je remets le code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="index.css" rel="stylesheet" type="text/css" />
<title>Document sans nom</title>
<script>
function list(liste,y){
var phrase = liste;
var vecteur = phrase.split(";");
var text = "<select>";
for (i = 0; i<y; i++){
text+='<option value='+vecteur[i]+'>'+vecteur[i]+'</option>';
}
text+="</select>"
document.getElementById(5).innerHTML = text;
}
function disable(y){
for (var i=1; i<=4; i++) {
if (i!=y){
document.getElementById(i).checked=false;
}
}
}
</script>
</head>
<body bgcolor="#000000">
<div id="check">
<ul>
<li class="intitule">Choisissez un type d'hébergement</li><br />
<li class="choix"><input type="checkbox" onclick="list('Appartement;Maison;Terrain;Local comercial',4);disable(1);" id="1">Locations saisonnières</li>
<li class="choix"><input type="checkbox" onclick="list('Appartement;Maison',2);disable(2);" id="2">Locations mensuelles</li>
<li class="choix"><input type="checkbox" onclick="list('Appartement;Maison;Terrain;Local commercial',4);disable(3);" id="3">Ventes immobilières</li>
<li class="choix"><input type="checkbox" onclick="list('Mobil home;emplacement;caravane;gîte;hôtel',5);disable(4);" id="4">Hôtels-Campings</li>
</ul>
<div id="5"></div>
</div>
</body>
</html>
reuh
voila pour ce qui est de les mettre en face par contre pour l'enlever désolé par reussi...
Adns
voila pour ce qui est de les mettre en face par contre pour l'enlever désolé par reussi...
<script>
function list(liste,y,j){
var decale = (j-1)*210;
if (y == 1)
margin = "";
else
margin = "style=margin-left:"+decale+"px";
var phrase = liste;
var vecteur = phrase.split(";");
var text = "<select "+margin+">";
for (i = 0; i<y; i++){
text+='<option value='+vecteur[i]+'>'+vecteur[i]+'</option>';
}
text+="</select>"
document.getElementById(5).innerHTML = text;
}
function disable(y){
for (var i=1; i<=4; i++) {
if (i!=y){
document.getElementById(i).checked=false;
}
}
}
</script>
<table>
<tr>
<td width = "200px" ><input type="checkbox" onclick="list('appart;maison;tente;camping',4,1);disable(1);" id="1">- locations de vacances</td>
<td width = "200px" ><input type="checkbox" onclick="list('appart;maison',2,2);disable(2);" id="2">- locations mensuelles</td>
<td width = "200px" ><input type="checkbox" onclick="list('appart;maison;villa;chalet',4,3);disable(3);" id="3">- ventes immobilières</td>
<td width = "200px" ><input type="checkbox" onclick="list('chambre;chalet;caravane;tente;camping',5,4);disable(4);" id="4">- hotels-campings </td>
</tr>
</table>
<div id="5"></div>
Adns
Bon je m'y remets... à mon avis je ne suis pas au bout de mes surprises! Merci ;)