Bonjour, je suis débutant en JS et donc en AJAX et j'aurai besoin d'un peu d'aide.
Je cherche à remplir des inputs selon le choix d'une valeur dans une liste déroulante par l'utilisateur sans actualiser la page.
J'ai trouvé sur le forum un exemple plutot bien détaillé mais comme je débute en JS je n'arrive pas à adapter le code.
dans mon fichier nouveau_devis.php
j'ai ensuite un fichier JS (fonction.js) que j'ai include dans le head avec la librairie:
et enfin le fichier (traitements.php) qui reçoit les infos envoyés par le fichier JS mais pour le moment, il ne reçoit rien....
merci à tous ceux qui pourront m'aider à me débloquer.
Modifié par cucaracha (27 Nov 2015 - 14:09)
Je cherche à remplir des inputs selon le choix d'une valeur dans une liste déroulante par l'utilisateur sans actualiser la page.
J'ai trouvé sur le forum un exemple plutot bien détaillé mais comme je débute en JS je n'arrive pas à adapter le code.
dans mon fichier nouveau_devis.php
<form method="post" action="" id="reference">
<div class="bloc light-blue-white">
<h2>Informations sur les pièces</h2>
<div class="wrap">
<table id="nouveau_devis_piece">
<tr id="piece1">
<td>Référence :</td>
<td>
<?php
$req = $bdd->query('SELECT reference '
. 'FROM liste_piece '
. 'ORDER BY reference ');
?>
<select name="reference" id="reference">
<?php while ($donnees = $req->fetch()) { ?>
<option value="<?php echo $donnees['reference']; ?>"><?php echo $donnees['reference']; ?></option>
<?php
}
$req->closeCursor();
?>
</select>
</td>
<td>Type :</td>
<td><input type="text" name="piece" id="piece" size="25" class="piece"></td>
<td>Prix Unitaire :</td>
<td><input type="text" name="prix_unitaire[]" id="prix_unitaire" size="25"></td>
</tr>
<tr id="piece2">
<td>Nombre de pièces :</td>
<td><input type="number" name="nombre_piece[]" id="nombre_piece" size="25"></td>
<td>Prix total piece:</td>
<td><input type="text" name="prix_total_piece[]" id="prix_total_piece" size="25"></td>
<td>Réduction :</td>
<td><input type="text" name="reduction_piece[]" id="reduction_piece" size="25"></td>
</tr>
</table>
<a href="#" onclick="duplic()">Ajouter une pièce</a> <br/>
<input type="submit" id="lancer_recherche" value="Valider" name="valide"/>
</div>
</div>
</form>
j'ai ensuite un fichier JS (fonction.js) que j'ai include dans le head avec la librairie:
$(document).ready(function() {
$('select#reference').change(function() {
//On récupère le nom
var value = $(this).val();
//Index
//On prépare l'Ajax
$.ajax({
//On indique le fichier ou aller consulter
url: "../vue/traitements.php",
//Le type de l'envoi (POST ou GET)
type: "POST",
//On indique que le résultat sera un tableau JSON
dataType: "JSON",
//On lui donne le nom de la personne
data: {reference : value},
success:function(data)
{
data = $.parseJSON(data);
$('input#piece').val(data.piece);
}
});
});
});
et enfin le fichier (traitements.php) qui reçoit les infos envoyés par le fichier JS mais pour le moment, il ne reçoit rien....
<?php
include('../connexion_bdd.php');
if(!empty($_POST['reference'])){
$ref = $_POST['reference'];
echo $_POST['reference'];
$sql = 'SELECT * FROM liste_piece WHERE reference="' . $ref . '"';
$select = $bdd->query($sql);
$select->setFetchMode(PDO::FETCH_OBJ);
$enregistrement = $select->fetchAll();
if ($enregistrement) {
$enregistrement = $enregistrement[0];
echo json_encode($enregistrement);
} else {
echo "Aucun résultat";
}
}
else{
$ref='0';
echo $ref;
}
?>
merci à tous ceux qui pourront m'aider à me débloquer.
Modifié par cucaracha (27 Nov 2015 - 14:09)