Fonctionnement AJAX et XMLHTTPRequest

Résolu
stiml
Messages postés
132
Date d'inscription
mardi 21 juin 2005
Statut
Membre
Dernière intervention
18 juin 2009
- 10 mars 2006 à 11:33
stiml
Messages postés
132
Date d'inscription
mardi 21 juin 2005
Statut
Membre
Dernière intervention
18 juin 2009
- 10 mars 2006 à 11:55
Bonjour,
Voila j'ai récupérer une script sur un site qui explique très bien comment fonctionne AJAX et XMLHTTPRequest.

voici l'adresse : http://siddh.developpez.com/articles/ajax/

comme vous pouvez le voir sur le fin du site il donne un code qui permet d'actualiser sans recharger la page un menu déroulant.
Moi j'ai modifier un peu ce code pour que lorsque que je saisi une lettre dans un champ texte, il me cherche les mots qui contiennent cette lettre dans la base de donnée, et actualise un menu déroulant.

le problème c'est que j'utilise un champ texte et non un menu déroulant pour actualiser l'autre terme.

j'ai modifier le code de la page auteur comme ceci :

<form>
<fieldset style="width: 500px">
<legend>Liste liées</legend>
<label>Auteurs</label>




</select>
<label>Livres</label>


<select name="livre">
<option value="-1">Choisir un auteur</option>
</select>


</fieldset>
</form>

le problème est que dans lafonction go(), il recherche un identifiant selectionné et pas ce que je tape! je m'explique voici la fonction go() :

function go(){
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('livre').innerHTML = leselect;
}
}


// Ici on va voir comment faire du post
xhr.open("POST","ajaxLivre.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('auteur');
la ligne suivante permet de récupérer ce qu'il y a été sélectionné dans un menu déroulant et je ne sais pas comment l'adapter pour un champ texte
idauteur = sel.options[sel.selectedIndex].value;
xhr.send("idAuteur="+idauteur);
}

En espérant avoir été assez clair, merci de m'aider



--------------------
StimL.

2 réponses

malalam
Messages postés
10839
Date d'inscription
lundi 24 février 2003
Statut
Membre
Dernière intervention
2 mars 2010
25
10 mars 2006 à 11:43
Hello,

<form>
<fieldset style="width: 500px">
<legend>Liste liées</legend>
<label>Auteurs</label>




</select>
<label>Livres</label>


<select name="livre">
<option value="-1">Choisir un auteur</option>
</select>


</fieldset>
</form>

function go(lettre){
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('livre').innerHTML = leselect;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","ajaxLivre.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('auteur');
la ligne suivante permet de récupérer ce qu'il y a été sélectionné dans un menu déroulant et je ne sais pas comment l'adapter pour un champ texte Ben voilà
xhr.send("lettreSel="+lettre);
}
3
stiml
Messages postés
132
Date d'inscription
mardi 21 juin 2005
Statut
Membre
Dernière intervention
18 juin 2009

10 mars 2006 à 11:55
C'est bon ça marche merci beaucoup! :)



--------------------
StimL.
0