Rechercher : dans
Par :

Case à cocher et liste déroulante

Dernière réponse le 20 avr 2009 à 15:17:42 liloo, le 17 avr 2009 à 14:25:49 
 Signaler ce message aux modérateurs

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 ^^

Configuration: Windows XP
Internet Explorer 7.0

Meilleures réponses pour « case à cocher et liste déroulante » dans :
Listes déroulantes simples avec Excel VoirDans votre tableau, vous souhaitez insérer un texte ou une valeur choisi dans une liste (déroulante). vous créez votre liste, ligne aprés ligne, sur votre feuille en cours ou sur une autre feuille du classeur en cours. vous la nommez : INSERTION...

1

adns, le 17 avr 2009 à 15:24:25

Bonjour

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 Hacker Vaillant Rien D'Impossible !!!
Le Monde du partage Remplacera le partage du monde

Répondre à adns

2

liloo, le 17 avr 2009 à 16:34:32

Merci beaucoup adns tu m'as enlevé une grosse épine du pied ! ^^

Bon je m'y remets... à mon avis je ne suis pas au bout de mes surprises! Merci ;)

Répondre à liloo

3

adns, le 20 avr 2009 à 10:20:32

De rien pense au sujet resolu ;);)

Adns Hacker Vaillant Rien D'Impossible !!!
Le Monde du partage Remplacera le partage du monde

Répondre à adns

4

liloo, le 20 avr 2009 à 10:37:26

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>

Répondre à liloo

5

liloo, le 20 avr 2009 à 10:56:35

Ah vi je voulais également savoir comment faire pour que quand on décoche une case la liste déroulante disparaisse

pour l'instt kan je coche sur une case elle apparait mais kan je décoche elle reste..

Merci ^^ ..de nouveau..

Répondre à liloo

6

adns, le 20 avr 2009 à 15:12:07

Reuh

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 Hacker Vaillant Rien D'Impossible !!!
Le Monde du partage Remplacera le partage du monde

Répondre à adns

7

 liloo, le 20 avr 2009 à 15:17:42

Merci!!!

C'est pas grave c'est déjà très bien ^^

Mon problème est résolu!

Répondre à liloo