Comment charger des infos d'un formulaire avec Ajax

Fermé
Ndediop Messages postés 101 Date d'inscription jeudi 2 mars 2017 Statut Membre Dernière intervention 5 juillet 2017 - Modifié le 14 avril 2017 à 16:29
Ndediop Messages postés 101 Date d'inscription jeudi 2 mars 2017 Statut Membre Dernière intervention 5 juillet 2017 - 18 avril 2017 à 10:29
Bonjour,

J'aimerais avoir de l'aide sur mon code, j'ai un formulaire et je veux le rafraichir en sélectionnant soit le nom ou l'identifiant d'un utilisateur au niveau de ma table users mais j'ai mis la fonction onchange avec request du coups j'ai mis en pièce jointe la partie concernée du code HTML, le PHP et le Js(Ajax pour avoir les informations de la base de données) mais peut être j'ai fait une erreur au niveau des syntaxes car je suis débutante sur ces différents langages bah du coups j'ai pris un exemple sur le select onchange sur openclassroom pour l'adapter à ce que je veux avoir mais rien ne s'affiche, mais j'ai pas mis la fonction onchange sur l'identifiant.

Merci d'avance!:)

Cordialement,
<form id="ajoutuser" method="post" action="ajoutuser.php">
                         <div class="box-body" style="display: none;">
                         <div class="row">
                         <div class="col-xs-6 col-sm-6 col-md-6">
                         <div class="form-group">
                            <label> Nom<sup>*</sup> :</label>
 
<select list="nomajoutuser_list" id="nomajoutuserSelect" onchange="request(this);" >
                                <option value="none">Selection</option>
                                <datalist id="nomajoutuser_list">';
                                $requete="SELECT DISTINCT nom_user FROM users";
                                    $resultats= $bdd_connection->query($requete); // liste de nom utilisateur
                                    while($ligne = $resultats->fetch()){
                                        echo'<option value="'.$ligne[0].'">';
                                    }
 
                        echo'</datalist> 
 
        </select>
            <span id="loader">
                    </span><br><br>
</div>
                         </div>
                        <div class="col-xs-6 col-sm-6 col-md-6">
                        <div class="form-group">
                            <label> Identifiant<sup>*</sup> :</label>
                                <input list="idajoutuser_list" name="identuser" id="identuser" class="form-control" type="text" placeholder="Ex : kkkk6666"></input>
                                <datalist id="idajoutuser_list">';
                                $requete="SELECT DISTINCT pseudo_user FROM users";
                                    $resultats= $bdd_connection->query($requete); // liste de id utilisateur
                                    while($ligne = $resultats->fetch()){
                                        echo'<option value="'.$ligne[0].'">';
                                    }      
                        echo'</datalist> 
                        </div>
                        </div>
                        </div><!-- /.col -->


PHP
header("Content-Type: text/xml");
 
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
 
echo "<list>";
 
 
$idEditor = (isset($_POST["Idnomajoutuser"])) ? htmlentities($_POST["Idnomajoutuser"]) : NULL;
 
 
if ($Idnomajoutuser) {
 
    $query = mysql_query("SELECT nom_user FROM users WHERE id_user=" . mysql_real_escape_string($idnomajoutuser) . " ORDER BY id_user");
 
    while ($back = mysql_fetch_assoc($query)) {
 
        echo "<item id=\"" . $back["id"] . "\" name=\"" . $back["id_user"] . "\" />";
 
    }
 
}
 
 
echo "</list>";

JavaScript
function request(oSelect) { // permet d'envoyer la requete
 
    var value = oSelect.options[oSelect.selectedIndex].value;
 
    var xhr   = getXMLHttpRequest();
 
     
 
    xhr.onreadystatechange = function() {
 
        if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
 
            readData(xhr.responseXML);
 
            document.getElementById("loader").style.display = "none";
 
        } else if (xhr.readyState < 4) {
 
            document.getElementById("loader").style.display = "inline";
 
        }
 
    };
 
     
 
    xhr.open("POST", "XMLHttpRequest_getListData.php", true);
 
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 
    xhr.send("IdEditor=" + value);
 
    /************************** Analyse les données XML et recrée les elements*************************/
 
function readData(oData) {// analyse les données XML et recrée les elemnts
 
    var nodes   = oData.getElementsByTagid_user("item");
 
    var oSelect = document.getElementById("usersSelect");
 
    var oOption, oInner;
 
     
 
    oSelect.innerHTML = "";
 
    for (var i=0, c=nodes.length; i<c; i++) {
 
        oOption = document.createElement("option");
 
        oInner  = document.createTextNode(nodes[i].getAttribute("id_user"));
 
        oOption.value = nodes[i].getAttribute("id");
 
         
 
        oOption.appendChild(oInner);
 
        oSelect.appendChild(oOption);
 
    }
 
}


EDIT : Ajout du LANGAGE dans les balises de code (la coloration syntaxique).
Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.

1 réponse

jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
14 avril 2017 à 16:35
Bonjour,

1 - Tu utilises l'ancienne extension mysql considérée comme obsolète.
Je t'invite vivement à passer à PDO ou mysqli.

2 - Plutôt que d'utiliser le format XML pour échanger les données entre ton php et ton javascript... tu devrais utiliser le format JSON (beaucoup plus simple)

3 - Lorsqu'un de tes codes (javascript (avec ou sans ajax....)) ne fonctionne pas... la première chose à faire c'est de vérifier dans la CONSOLE du navigateur si il n'y a pas des messages d'erreur.
Penses aussi à ajouter un peu de debug côté javascript (via l'instruction console.log par exemple) pour voir si ton code se déroule correctement.





0
Ndediop Messages postés 101 Date d'inscription jeudi 2 mars 2017 Statut Membre Dernière intervention 5 juillet 2017
18 avril 2017 à 10:29
Bonjour,

Merci pour la réponse jordan45 je vais essayer ce que vous m'avez dit.
0