[AJAX] Récupérer le texte et non la valeur d'un select

Version imprimable

Bonjour,
voila le code ajax je voudrait qu'il recuperer le texte et pas la valeur du select:

Code:

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
<script>
function showUser(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","index4.php?q="+str,true);
xmlhttp.send();
}
</script>

merci.

25/01/2013, 16h19
Bovino

Code:

HTMLSelectElement.options[HTMLSelectElement.selectedIndex].text
25/01/2013, 16h24
kate59

bonjour,

merci j avais bien trouver cette ligne sur des forums mais je ne sais pas ou la placer sur mon code.merci encore.

J'ia fait ceci mais ca ne marche pas:

Code:

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
<script>
function showUser(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").options[document.getElementById("txtHint").selectedIndex].text=xmlhttp.responseText;
 
    }
  }
xmlhttp.open("GET","index4.php?q="+str,true);
xmlhttp.send();
}
</script>

j'ai trouver quelques forums mais il ne rentre pas dans if(xhr.readyState == 4 && xhr.status == 200):

code index3.php

Code:

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
<html>
<head>
<script>
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;
			}
 
			function go(){
 
				var xhr = getXhr();
				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('txtHint').innerHTML = leselect;
					}
				}
				// poste l'id du site
				xhr.open("POST","index4.php",true);
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				var sel = document.getElementById('user2');
				var idsite = sel.options[sel.selectedIndex].text;
				xhr.send("q="+idsite);
			}
 
 
</script>
</head>
<body>
 
<form>
<select name="users2" id="users2" onchange="go()">
<option value="" selected>Select a person:</option>
<option value="http://localhost/appartement/backend/illustrations/home/2/velane _2_1_home.jpeg">velane _2_1</option>
<option value="http://localhost/appartement/backend/illustrations/home/2/velane _2_2_home.jpeg">velane _2_2</option>
<option value="http://localhost/appartement/backend/illustrations/home/2/velane _2_3_home.jpeg">velane _2_3</option>
<option value="http://localhost/appartement/backend/illustrations/home/2/velane _2_4_home.jpeg">velane _2_4</option>
<option value="http://localhost/appartement/backend/illustrations/home/2/velane _2_5_home.jpeg">velane _2_5</option>
 
</select>
 
 
</form>
<br>
<div id="txtHint"><b>Person info will be listed here.</b></div>
 
</body>
</html>

index4.php:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?php
$q=$_GET["q"];
print_r($_GET);
$con = mysql_connect('localhost','root');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }
 
mysql_select_db("appartement", $con);
 
$sql="SELECT id,titre,description,legende,position,ref_appartement
		FROM galerie WHERE legende = '".$q."'";
 
$result = mysql_query($sql);
 
echo'<div id="titre">'.$row['titre'].'</div>';
 
mysql_close($con);
?>

rien ne s'affiche mon but:
1. je selectionne dans la liste deroulante
2. je recupere le text de la liste selectione
3. je l'utilise dans mon sql pour remplir mon div

merci.

25/01/2013, 19h09
Bovino

Ben oui... avant de copier coller du code, il faut essayer de le comprendre pour pouvoir l'adapter à ses besoins... :roll:

Code:

xhr.open("POST","index4.php",true);

Citation:

page4.php:

puis

Code:

xhr.open("POST","index4.php",true);

Code:

$q=$_GET["q"];

:no:

PS : j'imagine que c'est inutile de te parler de console de débogage type Firebug... :calim2:
25/01/2013, 19h18
kate59

Excuse moi j'ai changer donc post en get et j'ai changer les noms c est bien index3.php et index4.php.
Maleureusement je n'ai pas firebug
Merci.
25/01/2013, 19h22
Bovino

Ben si tu testes sur Firefox, faut l'installer au plus vite !
Sinon, tu as des équivalents natifs pour Chrome, Opera ou IE.

Et donc, ça marche ou pas maintenant ?

il ne rentre toujours pas dans:

Code:

1
2
3
4
5
6
 if(xhr.readyState == 4 && xhr.status == 200){
					alert(1);
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('txtHint').innerHTML = leselect;
					}

merci.

Bonjour,

1-Qu'est ce qu'il te dit Firebug ?
2-

Citation:

if(xhr.readyState == 4 && xhr.status == 200){
alert(1);
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('txtHint').innerHTML = leselect;
}
Code:

1 2 3 4 5 6 7 8 9 10 if(xhr.readyState == 4){ if (xhr.status == 200){ alert(1); leselect = xhr.responseText; // On se sert de innerHTML pour rajouter les options a la liste document.getElementById('txtHint').innerHTML = leselect; } else{ alert("erreur :" + xhr.status);} }
3 - Si tu utilises GET, tu vires cette ligne

Citation:

xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');

et passer les paramètres en URL.

A+.