Discussion :

[Zarkoffe]

Bonjour,
J'essaye de faire un double ajax pour remplir 2 champs différents en fonction d'une même valeur. Je n'ai pas d'erreur, dans mon onglet Réseau les 2 variables passent bien. Mais l'un de mes 2 champs ne s'actualisent pas.
Je suis à la recherche d'une solution ou même mieux, d'une amélioration de mon système qui je pense est un peu crado.
La div qui se déclenche est donc "article_designationarticle" et celui qui ne fonctionne pas "article_prixunitaire". Merci d'avance.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<!-- PS  : c est un extrait, bien sûr tout cela est dans un tableau complet -->
              <td>
                <div class="article_designationarticle">
                  Le produit sera chargé ici
                </div>
              </td>
              <td>
                <div class="article_prixunitaire">
                  Le prix unitaire
                </div>
              </td>
<script>
  /* Affiche le nom de l'article en fonction de la référence sélectionnée */
  $(function(){
    $('#table_article').on('change', '.article_ref', function(){
      var article_ref = $(this).val();
      var article_designationarticle = $(this).parent().next().find('.article_designationarticle');
      $.ajax({
        url: "modal_header/Actions/ajax/inputdevis.php",
        method: "POST",
        data: { article_ref: article_ref }
      })
      .done(function( retour_html ) {
        article_designationarticle.html( retour_html );
      })
      .fail(function() {
        alert( "error facture creation ajax" );
      });       
    }); 
  });
    
  $(function(){
    $('#table_article').on('change', '.article_ref', function(){
      var article_ref = $(this).val();
      var article_prixunitaire = $(this).parent().next().find('.article_prixunitaire');
      $.ajax({
        url: "modal_header/Actions/ajax/getArticlePU.php",
        method: "POST",
        data: { article_ref: article_ref }
      })
      .done(function( retour_html ) {
        article_prixunitaire.html( retour_html );
      })
      .fail(function() {
        alert( "error facture creation ajax" );
      });       
    });
  });
  /* fin */
</script>

inputdevis.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php include '../../../../Include/connect.php' ; 
 
    $article_ref  = (array_key_exists('article_ref', $_POST)) ? $_POST['article_ref']: NULL; 
    if ($article_ref) {
        $stmt = $bdd->prepare('
            SELECT * FROM produit
            WHERE produit_ref = :ref
        ');
        $stmt->bindValue(':ref', strtoupper($article_ref), PDO::PARAM_STR);
        $stmt->execute();
        if ($donnees = $stmt->fetch(PDO::FETCH_ASSOC)) { ?>
            <input class="form-control" type="text" value="<?php echo $donnees['produit_nom'] ?>" />     
        <?php 
        }
    }

getArticlePU.php

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php include '../../../../Include/connect.php' ; 
 
    $article_ref  = (array_key_exists('article_ref', $_POST)) ? $_POST['article_ref']: NULL; 
    if ($article_ref) {
        $stmt = $bdd->prepare('
            SELECT * FROM produit
            WHERE produit_ref = :ref
        ');
        $stmt->bindValue(':ref', strtoupper($article_ref), PDO::PARAM_STR);
        $stmt->execute();
        if ($donnees = $stmt->fetch(PDO::FETCH_ASSOC)) { ?>
            <input class="form-control" type="text" value="<?php echo $donnees['produit_pu'] ?>" />     
        <?php 
        }
    }
?>

Merci d'avance

[Toufik83]

Salut,

Je vois qu'il y'a trop de répétition dans ton code jQuery.
Tu ne dois définir les éléments suivants qu'une seule fois et n'utiliser qu'un seul fichier php (pas deux) pour traiter les données :

• $(function(){});
• $('#table_article').on('change', '.article_ref', function(){...});

Supposons que la table est structurée comme ça :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
<table id="table_article">
     <tr><th>Select produit</th><th>Nom produit</th><th>Prix Unitaire produit</th></tr>
     <tr>	  
	<td>
		<select class="article_ref" >
                       <!-- Bien-sûr que cette partie doit être chargée en php-->
			<option value='1'>Produit 1</option>
                        <option value='2'>Produit 2</option>
                        <option value='3'>Produit 3</option>
		</select>
       </td>
	<td>
		<div class="article_designationarticle"></div>
	</td>
	<td>
		<div class="article_prixunitaire"></div>
	</td>
     </tr>
</table>

Maintenant tu dois utiliser le type de donnée json en ajoutant dataType:"json" dans $.ajax :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
$(function(){
		$('#table_article').on('change', '.article_ref', function(){
		  var article_ref = $(this).val();
		  var article_designationarticle = $(this).closest('#table_article').find('.article_designationarticle');//closest remonte jusqu'au #table_article pour trouver .article_designationarticle
		  var article_pu=$(this).closest('#table_article').find('.article_prixunitaire');//même chose ici avec closest()
		  $.ajax({
			url: "modal_header/Actions/ajax/getProduit.php",//un seul fichier php fera l'affaire.
			method: "POST",
			dataType:'json',// json ici obligatoire
			data: { article_ref: article_ref }
		  })
		  .done(function( retour ) {
			console.log('succes :',retour);
			  if(!retour.erreur){//si y'a pas d'erreur
				article_designationarticle.html( retour.produit_nom );
				article_pu.html(retour.produit_pu);
			  }
			  else alert(retour.erreur);//sinon affiche l'erreur
		  })
		  .fail(function() {
			alert( "error facture creation ajax" );
		  });       
		}); 
	  });

Et finalement le fichier getProduit.php :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<?php 
    include '../../../../Include/connect.php' ; 
    $retour=[]; //déclaration du tableau $retour qui sera renvoyé par le fichier comme réponse.
    $article_ref  = (array_key_exists('article_ref', $_POST)) ? $_POST['article_ref']: NULL; 
    if ($article_ref!=null) {
        $stmt = $bdd->prepare('
            SELECT * FROM produit
            WHERE produit_ref = :ref
        ');
        $stmt->bindValue(':ref', $article_ref, PDO::PARAM_INT);//$article_ref est un chiffre, pas la peine de mettre strtoupper et bien-sûr PARAM_INT au lieu de PARAM_STR
        $stmt->execute();
        if($stmt->rowCount()>0){
		$retour=$stmt->fetch(PDO::FETCH_ASSOC);//on stocke le résultat dans $retour.
	}
	else{
		$retour['erreur']='Aucun produit n\'a été trouvé !';
	}
	$stmt->closeCursor();//libérer le curseur
	unset($bdd);//détruit la connexion $bdd
    }
	echo json_encode($retour);//on renvoi $retour en tant que json

[Zarkoffe]

Merci beaucoup pour ta réponse.
Question : pourquoi utiliser du json? Quel est l'avantage?

J'ai tenté avec ton code, la variable semble bien être envoyé jusq'au getProduit.php mais j'ai mon erreur qui se déclenche (et mes 2 div ne chargent pas la valeur voulue). J'ai fais le tour du code je me demande d'où viens le problème... Ci joint un screen pour que tu y vois clair à mon soucis.


merci d'avance

[Invité]

Bonjour,

Question : pourquoi utiliser du json? Quel est l'avantage?

Ça permet de transmettre plusieurs valeurs en même temps.

[Toufik83]

Question : pourquoi utiliser du json? Quel est l'avantage?

L'avantage dans ton cas c'est de récupérer un objet contenant plusieurs variables avec un seul appel Ajax.
Je te signale que j'ai testé le code avant de le poster, et je n'ai pas l'erreur que tu reçois.
Pour avoir plus de détails sur l'erreur :
Modifies la fonction fail comme suite :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
.fail(function(error) {
	alert( "error facture creation ajax :"+error.responseText );
});

Regarde la réponse dans l'onglet Reseau.

[Zarkoffe]

Merci pour vos 2 réponses.

J'ai le résultat suivant :
Dans la console :

La ligne visée étant celle de l'alert();

Puis dans l'onglet réseau, le POST semble bien avoir été effectué:


Merci d'avance

[Toufik83]

tu es sûr que t'as mis error comme paramètre de la fonction fail ?

Le fichier getProduit.php contient bien un json_encode($retour); à la fin ?

cliques sur la ligne que tu vois dans l'onglet Réseau, et regarde ce qui est écrit dans le sous-onglet réponse...