11486 sujets

JavaScript, DOM et API Web HTML5

[Résolu] [javascript/ajax] Envoyer un tableau de données en ajax

Bonjour je souhaite envoyer un tableau avec du ajax a une page qui récupère les données et les stocks:

ici j'ai ma function qui envoie le tableau :

function sendData() {
        $table_objet2 = [
          ['cercle1', "matrix(1 0 0 1 497 75)"],
          ["cercle2", "matrix(1 0 0 1 497 130)"],
          ["cercle3", "matrix(1 0 0 1 497 185)"],
          ["cercle4", "matrix(1 0 0 1 497 240)"],
          ["cercle5", "matrix(1 0 0 1 497 295)"]
        ];

        var data = new FormData();
        data.append('table_objet2', table_objet2);

        var requeteAjax = new XMLHttpRequest();
        requeteAjax.open('POST', 'recup.php');
        requeteAjax.send(data);
      }


les données sont envoyé à la page recup.php qui récupère les données sauf que j'ai un tableau vide ...

<?php
     // probleme toujour vide ce tableau !
     $table_objet = $_POST['table_objet'];
?>

je ne comprends pas trop ou est l'erreur surement très bête
je peux rajouter aussi que j'ai un button qui execute la function javascript : 

<button onclick="sendData()"> Enregistrer </button>
Salut,

Ta variable table_objet2 est déclarée comme une variable PHP dans le premier bout de code, ton problème vient peut-être de là ?

let tableau_objet2 = []


Et aussi, dans ton append tu lui donnes le nom de table_objet2, alors qu'en PHP tu essayes de récupérer le tableau avec $_POST['table_objet'], donc pas le même nom.
Modérateur
Et l'eau,

Smiley cligne 


...
$table_objet2 = [
....
data.append('table_objet2', table_objet2);
....

Modifié par niuxe (28 Apr 2020 - 10:01)
merci j'avais pas vue ! Smiley sweatdrop

Mais le problème persiste ... j'ai toujours un tableau vide :

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      function sendData() {
        let table_objet2 = [
          ['cercle1', "matrix(1 0 0 1 497 75)"],
          ["cercle2", "matrix(1 0 0 1 497 130)"],
          ["cercle3", "matrix(1 0 0 1 497 185)"],
          ["cercle4", "matrix(1 0 0 1 497 240)"],
          ["cercle5", "matrix(1 0 0 1 497 295)"]
        ];

        var data = new FormData();
        data.append('table_objet2', table_objet2);

        var requeteAjax = new XMLHttpRequest();
        requeteAjax.open('POST', 'recup.php');
        requeteAjax.send(data);
      }
    </script>
    <button onclick="sendData()"> Enregistrer </button>
  </body>
</html>

Modifié par eventdark (28 Apr 2020 - 10:04)
niuxe a écrit :
Et l'eau,

Smiley cligne 


...
$table_objet2 = [
....
data.append('table_objet2', table_objet2);
....


je n'ai pas compris ton message Smiley smile ...
E:\Program\UwAmp\www\Ajax_Cours\Application_cours\dessin_schema\test.php:31:
array (size=0)
empty

il renvoi ca donc le tableau est vide ...


<script type="text/javascript">
      function sendData() {
        let table_objet2 = [
          ['cercle1', "matrix(1 0 0 1 497 75)"],
          ["cercle2", "matrix(1 0 0 1 497 130)"],
          ["cercle3", "matrix(1 0 0 1 497 185)"],
          ["cercle4", "matrix(1 0 0 1 497 240)"],
          ["cercle5", "matrix(1 0 0 1 497 295)"]
        ];

        var data = new FormData();
        data.append('table_objet2', table_objet2);

        var requeteAjax = new XMLHttpRequest();
        requeteAjax.open('POST', 'test.php');
        requeteAjax.send(data);
      }
    </script>
    <button onclick="sendData()"> Enregistrer </button>

    <?php
      var_dump($_POST);
    ?>

Modifié par eventdark (28 Apr 2020 - 10:18)
Modérateur
eventdark a écrit :


je n'ai pas compris ton message Smiley smile ...


$table_objet2 != table_objet2

Ensuite, regarde dans la console/reseau (network) si ta requête est bien passé. Le var_dump, tu ne peux pas forcément le voir
J'ai setup ton code dans un env local, est tout marche bien je reçois les données en POST, et comme l'a dit Niuxe la requête passe avec le tableau.
niuxe a écrit :


$table_objet2 != table_objet2

Ensuite, regarde dans la console/reseau (network) si ta requête est bien passé. Le var_dump, tu ne peux pas forcément le voir


je n"ai jamais utilisé la console/reseau mais je pense que la requête ne pars par car j'ai ca quand j'appuie sur le bouton :
0 / 1 requests
Wazazaby a écrit :
J'ai setup ton code dans un env local, est tout marche bien je reçois les données en POST, et comme l'a dit Niuxe la requête passe avec le tableau.


je comprends pas pourquoi moi ca ne fonctionne pas ...

mon code en entier c'est ca : 


<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      function sendData() {
        var table_objet2 = [
          ['cercle1', "matrix(1 0 0 1 497 75)"],
          ["cercle2", "matrix(1 0 0 1 497 130)"],
          ["cercle3", "matrix(1 0 0 1 497 185)"],
          ["cercle4", "matrix(1 0 0 1 497 240)"],
          ["cercle5", "matrix(1 0 0 1 497 295)"]
        ];

        var form_data = new FormData();
        form_data.append('table_objet2', table_objet2);

        var requeteAjax = new XMLHttpRequest();
        requeteAjax.open('POST', 'test.php');
        requeteAjax.send(form_data);
      }
    </script>
    <button onclick="sendData()"> Enregistrer </button>

    <?php
      var_dump($_POST);
    ?>
  </body>
</html>

Modifié par eventdark (28 Apr 2020 - 11:32)
Sujet clos
Aller à