Formulaire PHP/Ajax, erreur de remplissage de liste

**Misoss** · 22/07/2013, 14h43

Bjr,
j'ai un petit soucis avec des listes déroulantes qui doivent proposer des choix suivants la liste précédente, cependant la liste 'prise' disparaît lorsque que la liste 'salle' est remplit (cf. Screen en PJ)

Merci pour votre aide

ajax.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<html>
	<head>
		<title>TEST le 20/07/2013</title>
		<script type='text/javascript' src="js/jquery-liste-salleBat.js">
 
		</script>
	</head>
	<body>
		<form>
			<fieldset style="width: 800px">
				<legend>Liste li&eacut;es</legend>
				<label>Batiment</label>
				<select name='batiment' id='batiment' onchange='change()'>
					<option value='-1'>Choisir un batiment</option>
					<?php
include "inc/conf.inc.php";
						mysql_connect($sql_host,$sql_user,$sql_pass);
						mysql_select_db($sql_data);
						$res = mysql_query("SELECT * FROM batiment ORDER BY id");
						while($row = mysql_fetch_assoc($res)){
							echo "<option value='".$row["id"]."'>".$row["batiment"]."</option>";
						}
					?>
				</select>
				<label>Salle</label>
				<div id='salle' style='display:inline'>
				<select name='salle' onchange='change2()'>
					<option value='-1'>Choisir une salle</option>
				</select>
				<label>Prise</label>
				<div id='prise' style='display:inline'>
				<select name='prise'>
					<option value='-1'>Choisir une prise</option>
				</select>
 
				</div>
			</fieldset>
		</form>
	</body>
</html>

ajaxSalle.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php
include "inc/conf.inc.php";
 
	echo "<select name='salle'>";
	if(isset($_REQUEST["idBatiment"])){
		mysql_connect($sql_host,$sql_user,$sql_pass);
		mysql_select_db($sql_data);
		$res = mysql_query("SELECT id,salle,nbprise FROM salle WHERE idbatiment=".$_REQUEST["idBatiment"]." ORDER BY id")or die("Erreur de chargement de la liste des batiments".mysql_error());
		while($row = mysql_fetch_assoc($res)){
			echo "<option value='".$row["nbprise"]."'>".$row["salle"]."</option>";
		}
		mysql_close();
	}
	else
		echo "<option value='-1'>Choisir une salle</option>";
	echo "</select>";
?>

ajaxPrise.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<?php
include "inc/conf.inc.php";
	echo '<select  name="prise" id="prise" onchange="change2()">';
 
	if(isset($_REQUEST["nbPrise"])){
?>
				<option value='A'>A</option>
				<option value='B'>B</option>
			<?php
		mysql_connect($sql_host,$sql_user,$sql_pass);
		mysql_select_db($sql_data);
 
				$sqlnbprise = mysql_query("SELECT * FROM salle  WHERE nbprise=".$_REQUEST["nbPrise"]." ORDER BY id")or die("Erreur de chargement de la liste des batiments".mysql_error());
				while($prise = mysql_fetch_array($sqlnbprise)){
				$nbprise = $prise['nbprise'];
				if ($nbprise = 3) {
					echo "<option value='C'>C</option>";
 
				}
				elseif($nbprise = 4) {
					echo "<option value='C'>C</option>";
					echo "<option value='D'>D</option>";
				}
				elseif($nbprise = 5) {
					echo "<option value='C'>C</option>";
					echo "<option value='D'>D</option>";
					echo "<option value='E'>E</option>";
				}
				elseif($nbprise = 6){
					echo "<option value='C'>C</option>";
					echo "<option value='D'>D</option>";
					echo "<option value='E'>E</option>";
					echo "<option value='F'>F</option>";
				}
			//	else{echo 'pas de prise disponible';}
 
				}
			?>
			</select>
<?php
	}
	else{
		echo "<option value='-1'>Choisir une salle</option>";
	echo "</select>";
 }
?>

jquery-liste-salleBat.js

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
function getXhr(){
    var xhr = null;
	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; 
	} 
        return xhr;
}
/**
* Méthode qui sera appelée sur le click du bouton Batiment pour renseigner Salle
*/
function change(){
	var xhr = getXhr();
	// On défini ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function(){
	//	alert(xhr.readyState);
	// 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){
			di = document.getElementById('salle');
			di.innerHTML = xhr.responseText;
		}
	}
	// Ici on va voir comment faire du post
	xhr.open("POST","ajaxSalle.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 du batiment
	idbatiment = document.getElementById('batiment').options[document.getElementById('batiment').selectedIndex].value;
	//alert(idbatiment);
	xhr.send("idBatiment="+idbatiment);
}
/**
* Méthode qui sera appelée sur le click du bouton Salle pour définir la prise
*/
function change2(){
	var xhr = getXhr();
	// On défini ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function(){
		alert(xhr.readyState);
		// 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){
			di = document.getElementById('prise');
			di.innerHTML = xhr.responseText;
		}
	}
	// Ici on va voir comment faire du post
	xhr.open("POST","ajaxPrise.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 du batiment
	nbprise = document.getElementById('salle').options[document.getElementById('salle').selectedIndex].value;
	alert(nbprise);
	xhr.send("nbPrise="+nbprise);
}

Formulaire PHP/Ajax, erreur de remplissage de liste

Langage PHP

Mode arborescent

Discussions similaires

Partager

Partager