Multi insertions en ajax

Résolu/Fermé
Youn_3451 Messages postés 37 Date d'inscription lundi 19 octobre 2020 Statut Membre Dernière intervention 6 avril 2021 - Modifié le 8 déc. 2020 à 19:37
jordane45 Messages postés 38300 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 novembre 2024 - 9 déc. 2020 à 22:26
Bonjour bonsoir, il n'y a pas longtemps de la je suis venu sur le forum pour un problème concernant une multi insertions en Ajax.

Le script que nous avant fait ensemble fonctionner, mais tout d'un coup , il a cessé de fonctionner sans aucun raison.

Il avait pour but d’insérer des articles dans la base de données suivante :



article = designation de l'article
referencearticle = reference de l'article
cout = cout
quantite = quantite
umesure = unite de mesure
tva
remise
numeros = numeros qui va permettre de rattaché un article a une facture
typ = facture , devis , ect
id_session = id de la session

Visuel de la page de création de devis :



Code html (formulaire): (Version réduit)


<!-- partie article -->

<div class="invoice-item d-flex border rounded mb-1">
                                                            <div class="invoice-item-filed row pt-1 px-1">
                                                                <div class="col-12 col-md-4 form-group">
                                                                    <select id="article" class="form-control invoice-item-select">
                                                                        <option value="Pas d'article">Sélectionnez un article</option>
                                                                        <optgroup label="Liste des clients">
                                                                        </optgroup>
                                                                        <?php foreach($article as $articlee): ?>
                                                                        <option value="<?= $articlee['article'] ?>"><?= $articlee['article'] ?></option>
                                                                        <?php endforeach; ?>
                                                                        <optgroup label="Autres options">
                                                                        <option value="Pas d'article">Autres</option>
                                                                        </optgroup>
                                                                    </select>
                                                                </div>
                                                                <div class="col-md-3 col-12 form-group">
                                                                    <input name="cout" id="cout" type="number" class="form-control" placeholder="0" onkeyup="myFunction()">
                                                                </div>
                                                                <div class="col-md-3 col-12 form-group">
                                                                    <input name="quantite" id="quantite" type="number" class="form-control" placeholder="0" onkeyup="myFunction()">
                                                                </div>
                                                                <div class="col-md-2 col-12 form-group">
                                                                          <strong id="demo" class="text-primary align-middle">00.00 €</strong>
                                                                </div>
                                                                <div class="col-md-4 col-12 form-group">
                                                                    <label for="article">Nouvelle Article :</label>
                                                                    <input name="article" id="newarticle" type="text" class="form-control invoice-item-desc" placeholder="Nouvelle article">
                                                                </div>
                                                                <div class="col-md-3 col-12 form-group">
                                                                    <label for="ref">REF :</label>
                                                                    <input name="referencearticle" id="referencearticle" type="text" class="form-control invoice-item-desc" placeholder="Réference">
                                                                </div>
                                                            </div>
                                                            <div class="invoice-icon d-flex flex-column justify-content-between border-left p-25">

                                                                <div class="dropdown">
                                                                    <i class="bx bx-cog cursor-pointer dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button"></i>
                                                                    <div class="dropdown-menu p-1">
                                                                        <div class="row">
                                                                            <div class="col-12 form-group">
                                                                                <label>Remise(%)</label>
                                                                                <input name="remise" id="remise" value="0" type="number" class="form-control" placeholder="remise" maxlength="3" min="0" max="100">
                                                                            </div>
                                                                            <div class="col-12 form-group">
                                                                                <label>Tva(%)</label>
                                                                                <input name="tva" id="tva" value="0" type="number" class="form-control" placeholder="0" maxlength="3">
                                                                            </div>
                                                                            <div class="col-12 form-group">
                                                                                <label>Unite de mesure :</label>
                                                                                <input name="umesure" id="umesure"  type="text" class="form-control" placeholder="Unite de mesure">
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

<!-- partie article -->



Mon code js


        $(document).ready(function(){      
        var id = 1; 

        $("#button_send").click(function(){
            var articlee = $("#article").val() == "Pas d'article" ? $("#newarticle").val() : $("#article").val();
            var newid = id++; 
            $("#table").append(`<tr valign="top" id="${newid}">
            <td width="100px" class="numeros${newid}">${$("#numeros").val()}</td>
            <td width="100px" class="referencearticle${newid} line">${$("#referencearticle").val()}</td>
            <td width="100px" class="article${newid} line">${articlee}</td>
            <td width="100px" class="cout${newid}">${$("#cout").val()}</td>
            <td width="100px" class="quantite${newid}">${$("#quantite").val()}</td>
            <td width="100px" class="umesure${newid}">${$("#umesure").val()}</td>
            <td width="100px" class="tva${newid}">${$("#tva").val()} %</td>
            <td width="100px" class="remise${newid}">${$("#remise").val()} %</td>
            <td width="100px"><a href="javascript:void(0);" class="remCF"><i class='bx bx-x red'></i></a></td></tr>`);
        });

        // function to remove article if u don't want it
        $("#table").on('click', '.remCF', function(){
            $(this).parent().parent().remove();
        });

        $("#button_save").click(function(){
            
            var lastRowId = $('#table tr:last').attr("id");
            var numeros = new Array();
            var article = new Array(); 
            var referencearticle = new Array();
            var cout = new Array();
            var quantite = new Array();
            var umesure = new Array();
            var tva = new Array();
            var remise = new Array();
            
            for ( var i = 1; i <= lastRowId; i++) {
                numeros.push($("#"+i+" .numeros"+i).html());
                article.push($("#"+i+" .article"+i).html()); 
                referencearticle.push($("#"+i+" .referencearticle"+i).html()); 
                cout.push($("#"+i+" .cout"+i).html());
                quantite.push($("#"+i+" .quantite"+i).html()); 
                umesure.push($("#"+i+" .umesure"+i).html());
                tva.push($("#"+i+" .tva"+i).html()); 
                remise.push($("#"+i+" .remise"+i).html());
            }

            var sendNumeros = JSON.stringify(numeros); 
            var sendArticle = JSON.stringify(article); 
            var sendRef = JSON.stringify(referencearticle);
            var sendcout = JSON.stringify(cout);
            var sendquantite = JSON.stringify(quantite);
            var sendUmesure = JSON.stringify(umesure);
            var sendTVA = JSON.stringify(tva);
            var sendremise = JSON.stringify(remise);

            $.ajax({
                url: "../../../html/ltr/coqpix/php/insert_articles_facture.php", //new path, save your work first before u try
                type: "POST",
                data: {
                    numeros : sendNumeros,
                    article : sendArticle,
                    referencearticle : sendRef, 
                    cout : sendcout, 
                    quantite : sendquantite,
                    umesure : sendUmesure,
                    tva : sendTVA,
                    remise : sendremise,
                },
                success:function(data){
                }
            });
        });
        });





Code php insert_articles_facture.php


<?php
session_start();

//connexion à la bdd
require_once 'config.php';

//récupération PROPRE des variables AVANT de les utiliser
$numArr = !empty($_POST["numeros"]) ? $_POST["numeros"] : NULL; //PAS DE json_decode parce que il n'est pas dans la boucle
$artArr = !empty($_POST["article"]) ? json_decode($_POST["article"]) : NULL;
$refArr = !empty($_POST["referencearticle"]) ? json_decode($_POST["referencearticle"]): NULL;
$coutArr = !empty($_POST["cout"]) ? json_decode($_POST["cout"]): NULL;
$tvaArr = !empty($_POST["tva"]) ? json_decode($_POST["tva"]): NULL;
$remiseArr = !empty($_POST["remise"]) ?json_decode($_POST["remise"]): NULL;
$quantArr = !empty($_POST["quantite"]) ? json_decode($_POST["quantite"]): NULL;
$umesureArr = !empty($_POST["umesure"]) ? json_decode($_POST["umesure"]): NULL;
$typ = "";
$id_session = !empty($_SESSION['id_session']) ? $_SESSION['id_session'] : NULL ; //$_SESSION


$sql = "INSERT INTO articles 
        (article, referencearticle, cout, quantite, umesure, tva, remise, numeros, typ, id_session) 
        VALUES (?,?,?,?,?,?,?,?,?,?)";

if(!empty($artArr)){
  for ($i = 0; $i < count($artArr); $i++) {

    if((!empty($artArr[$i]))) {

      $datas = array($artArr[$i],
                     $refArr[$i],
                     $coutArr[$i],
                     $quantArr[$i],
                     $umesureArr[$i],
                     $tvaArr[$i],
                     $remiseArr[$i],
                     $numArr,
                     $typ,
                     $id_session
                    );

      try {
        $pdoSt = $bdd->prepare($sql);
        $result['SUCCESS'][] = $pdoSt->execute($datas);
      } catch (Exception $e) {
         $result[] =  array('ERROR'=>  $e->getMessage(), 'DATAS'=>$datas );
      }
    } else{
        $result[] = array('ERROR'=> "variable artArr[".$i."] vide !!") ;
    }

  }
}else{
  $result = array('ERROR'=> "variable vide !!", 'POST'=>$_POST) ;
}

echo json_encode($result); // on renvoi le result dans le javascript au format json
exit;
?>
?>



Dans la console , il y a une erreur rien avoir avec mon probleme j'ai essaye de la resoudre tant bien que mal mais je ne voit pas d'ou elle provient

Errreur :



Code js complete-facture :


function loadDatasclient(name_client) {
        var data = {name_client: name_client};
        $.ajax({
            type: "POST",
            url: "php/load-cs-client.php",
            data: data,
            async: true,
            dataType: "json"
        }).done(function (reponse) {
          var adresse = typeof (reponse.adresse) != 'undefined' ? reponse.adresse : '';
          var email = typeof (reponse.email) != 'undefined' ? reponse.email : '';
          var departement = typeof (reponse.departement) != 'undefined' ? reponse.departement : '';
          var tel = typeof (reponse.tel) != 'undefined' ? reponse.tel : '';
          $("#adresse").val(adresse);
          $("#departement").val(departement);
          $("#email").val(email);
          $("#telephone").val(tel);

        }).fail(function (jqXHR, textStatus) {
          alert('Ajax error');
          console.log({textStatus}, {jqXHR})
        });

      }

      $(document).ready(function (){

        loadDatasclient();

        $("#facturepour").on("change", function (){
            var name_client = $(this).val(); // ID correspondant dans la bdd au facturepour selectionné
            loadDatasclient(name_client);
        });
      });


      // article


function loadDatasarticle(article) {
        var datat = {article: article};
        $.ajax({
            type: "POST",
            url: "php/load-cs-article.php",
            data: datat,
            async: true,
            dataType: "json"
        }).done(function (reponses) {
          var prixvente = typeof (reponses.prixvente) != 'undefined' ? reponses.prixvente : '';
          var tvavente = typeof (reponses.tvavente) != 'undefined' ? reponses.tvavente : '20';
          var referencearticle = typeof (reponses.referencearticle) != 'undefined' ? reponses.referencearticle : '';
          var unitemesure = typeof (reponses.umesure) != 'undefined' ? reponses.umesure : '';
          $("#cout").val(prixvente);
          $("#tva").val(tvavente);
          $("#referencearticle").val(referencearticle);
          $("#umesure").val(unitemesure);

        }).fail(function (jqXHR, textStatus) {
          alert('Ajax error');
          console.log({textStatus}, {jqXHR})
        });

      }

      $(document).ready(function (){

        loadDatasarticle();

        $("#article").on("change", function (){
            var article = $(this).val(); // ID correspondant dans la bdd au facturepour selectionné
            loadDatasarticle(article);
        });
      });

A voir également:

1 réponse

jordane45 Messages postés 38300 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 novembre 2024 4 704
8 déc. 2020 à 20:15
Bonjour,

Déjà, le message d'erreur est bien lié à tes appels ajax de tes deux fonctions loadDatasarticle et loadDatasclient
ils indiquent que la variable "reponse" est null .. ce qui signifie que tes scripts PHP ne retournent aucun résultat.

Tu peux, soit retourner quelque chose depuis tes scripts PHP ... soit, dans ton JS, t'assurer que la variable existe et n'est pas null
pour ça, un simple IF dans le .done de ton ajax fera le job
par exemple
}).done(function (reponse) {
          if (typeof(reponse)!="undefined" && reponse!=null ){  
            var adresse = typeof (reponse.adresse) != 'undefined' ? reponse.adresse : '';
            var email = typeof (reponse.email) != 'undefined' ? reponse.email : '';
            var departement = typeof (reponse.departement) != 'undefined' ? reponse.departement : '';
            var tel = typeof (reponse.tel) != 'undefined' ? reponse.tel : '';
            $("#adresse").val(adresse);
            $("#departement").val(departement);
            $("#email").val(email);
            $("#telephone").val(tel);
          }
        }).fail(function (jqXHR, textStatus) {


Une fois que tu auras corrigés tes deux fonctions, si le souci persiste, pense à déplier la ligne >post correspondant à ton appel ajax (celui pour l'ajout en bdd ) et à regarder l'onglet "requete" pour voir les variables qui sont envoyées à ton script php et l'onglet "reponse" pour voir;. ben... la réponse.


Au passage, tâche d'écrire ton JS pour l'insertion en BDD de la même façon que tes autres appels ajax ( avec les fonction .done et .fail ) et en y mettant des console.log (comme ce que je t'avais déjà donné... ) afin de voir, dans la console de ton navigateur, ce qui se passe dans tes scripts.

0
Youn_3451 Messages postés 37 Date d'inscription lundi 19 octobre 2020 Statut Membre Dernière intervention 6 avril 2021
9 déc. 2020 à 11:25
Bonjours merci , ça fonctionne.
J'ai une autre petite question

(dans une autre page :') )
0
jordane45 Messages postés 38300 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 novembre 2024 4 704 > Youn_3451 Messages postés 37 Date d'inscription lundi 19 octobre 2020 Statut Membre Dernière intervention 6 avril 2021
9 déc. 2020 à 22:26
La question étant résolue, merci de mettre ce sujet en RESOLU.
0