Bonjour, j'ai un formulaire avec des listes de valeurs. Je veux pouvoir retrouver l'information qui correspond à la combinaison des valeurs choisies dans ces listes. Pour cela, je veux utiliser JavaScript car je ne veux pas recharger ma page.

<form methode="post" action="fichier.php">
<select name ="marque" id="marque">
<option>Hyundai</option>
<option>Toyota</option>
<option>Peugeot</option>
<option>Lexus</option>
</select>
<select name ="modele" id="modele">
<option>Tucson</option>
<option>Yaris</option>
<option>Corolla</option>
<option>Elentra</option>
</select>
<select name ="annee"cid="annee">
<option>2010</option>
<option>2011</option>
<option>2012</option>
<option>2013</option>
</select>
<input type="text" name="prix" id="prix" value="">
</form>

Dans ma base de données j'ai une table qui contient les enregistrements

Je sèche sur le code JavaScript

J'ai essayé ceci mais le résultat, bien entendu n'est pas satisfaisant.

<script language=javascript>
function changecategorie() 
{
marque= document.getElementById('marque').value;
modele= document.getElementById('modele').value;
annee= document.getElementById('annee').value;
<?php
$sql = $connexion->query("SELECT prix FROM voitures WHERE marque= '$marque' AND modele='$modele' AND annee='$annee' "); 
$leprix = $sql->fetch(PDO::FETCH_OBJ);
$prix= $leprix ->prix ;
?>
document.getElementById('prix').value =<?php echo $prix; ?>;
}
</script>

Besoin d'aide! Merci

-
Edité par pts74 9 mai 2022 à 12:36:45

Salut,

ce que tu veux s'appelle "ajax", il vaut mieux utiliser jquery car leur fonction $.ajax est très pratique et facile à utiliser, sinon tu as xmlhttprequest en js pur. En gros, c'est le même principe que ce que tu as écris, sauf que le php se trouve sur une page php, et que tu utilises la fonction js prévue pour.

Ensuite, à la fin de la page php, tu écris un résultat avec "echo", ou généralement un json_encode($taVariable) quand tu as un tableau, et dans le js, tu as une fonction qui réceptionne le retour (en jquery c'est la fonction success, sinon en js pur c'est la valeur "200" quand tout s'est bien passé).

Dans ce retour, tu vas recevoir du texte, si tu avais un tableau et que tu as fait json encode, tu vas "parser" le résultat, ça veut dire que tu vas transformer le texte reçu sous forme d'"objet" : ça c'est un objet :

{ titre : valeur }

et tu vas pouvoir faire tonJson.titre pour obtenir le contenu de titre, c'est à dire "valeur". Sinon tu affiches simplement le mot retourné par php. 

Tout ça est beaucoup documenté, si tu regardes sur google ou sur openclassrooms. Pour jquery, il y a quelques méthodes classiques à utiliser, par exemple (ex de la doc) :

$.ajax({
  method: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
})
  .done(function( msg ) {
    alert( "Data Saved: " + msg );
  });

tu envoies ce qu'il y a dans "data", ici c'est un objet avec 2 clés/valeurs : name et location

Dans le php, tu récupères ces variables avec $_POST["name"] car on a mis la méthode "POST" comme moyen d'envoyer les données.

Et quand le php fait un echo du résultat (par exemple le prix de la voiture), il arrive dans le paramètre "msg", tu peux mettre le mot que tu veux, il faut réutiliser le même mot ensuite dans la fonction. Ici ils utilisent done, mais tu as aussi success (à voir dans la doc ou les centaines d'exemples sur stackoverflow avec une recherche google)

Pour parser le json, si tu as utilisé json_encode, c'est JSON.Parse(msg), ou bien tu peux rajouter : 

dataType: "json"

et ça va lui préciser que le retour est du json, donc il va le parser automatiquement. Tu pourras faire une boucle sur le résultat de msg, avec each en jquery.

Pour charger jquery, tu l'ajoutes en faisant ça :

<script src="https://code.jquery.com/jquery-3.6.0.js"
    integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
    crossorigin="anonymous"></script>

avant la fermeture de la balise "</head>".

-
Edité par Arthur222 10 mai 2022 à 0:17:43

Bonsoir

J'essaie depuis de répondre au message en y ajoutant du code mais je reçois le message selon lequel je suis bloqué

Oui c'est un bug sur openclassrooms, tu peux utiliser codepen.io ou jsfiddle pour mettre du code. Il faut mettre le code, cliquer sur "save", et copier coller l'adresse url qui s'affiche.