Insertion SQL dynamique + SPAN success

**Zarkoffe** · 30/10/2018, 12h16

Bonjour,

Mon code me permet d'insérer plusieurs lignes dans ma bdd. J'ai voulu compléter mon code par du JS/Jquery pour faire passer mes variables:

- m'évitant le rechargement de page.

- affichant un span de succès ou d'echec sur mon insertion.

J'ai bien suivi la doc, mais ça ne s'insert plus dans ma base et le span ne s'affiche pas. Ci-dessous mon code.

1.php est le formulaire

2.php est l'insertion SQL

script.JS est le passage de variable dynamiques.

1.php

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<?php include 'connection.php' ; ?>
<HTML>
  <HEAD>
  <meta charset="utf-8">
  <title>Poster en ajax</title>
  <link rel="stylesheet" href="ajax.css">
  <script src="jquery.min.js"></script>
  <script src="script.js"></script>
 
 
<TITLE> Add/Remove dynamic rows in HTML table </TITLE>
 
<SCRIPT language="javascript">
function addRow(tableID) {
 
      var table = document.getElementById(tableID);
 
      var rowCount = table.rows.length;
      var row = table.insertRow(rowCount);
 
      var cell1 = row.insertCell(0);
      var element1 = document.createElement("input");
      element1.type = "checkbox";
      element1.name="chkbox[]";
      cell1.appendChild(element1);
 
      var cell2 = row.insertCell(1);
      cell2.innerHTML = "<input type='text'  name='devis_ref[]' class='devis_ref[]' />";
 
      var cell3 = row.insertCell(2);
      cell3.innerHTML = "<input type='text'  name='devis_contact[]' class='devis_contact[]' />";
      //cell2.innerHTML = "<select name='item[]' id='facture_fournisseur' type='text' class='form-control'>< $list = $bdd->query('SELECT * FROM fournisseur');while ($data = $list->fetch()) { ?><option value='< echo $data['fournisseur_nom']; ?>'> < echo $data['fournisseur_nom']; ?></option>< } $list->closeCursor(); ?></select>";
 
      var cell4 = row.insertCell(3);
      cell4.innerHTML = "<input type='text'  name='devis_refarticle[]' class='devis_refarticle[]' />";
 
      var cell5 = row.insertCell(4);
      cell5.innerHTML =  "<input type='text'  name='devis_designationarticle[]' class='devis_designationarticle[]' />";
 
      var cell6 = row.insertCell(5);
      cell6.innerHTML = "<input type='text'  name='devis_pu[]' class='devis_pu[]' />";
 
      var cell7 = row.insertCell(6);
      cell7.innerHTML =  "<input type='text'  name='devis_unite[]' class='devis_unite[]' />";
 
      var cell8 = row.insertCell(7);
      cell8.innerHTML = "<input type='text'  name='devis_quantite[]' class='devis_quantite[]' />";
 
      var cell9 = row.insertCell(8);
      cell9.innerHTML =  "<input type='text'  name='devis_prixnetunite[]' name='devis_prixnetunite[]' />";
      }
 
    function deleteRow(tableID) {
        try {
        var table = document.getElementById(tableID);
        var rowCount = table.rows.length;
 
        for(var i=0; i<rowCount; i++) {
            var row = table.rows[i];
            var chkbox = row.cells[0].childNodes[0];
            if(null != chkbox && true == chkbox.checked) {
                table.deleteRow(i);
                rowCount--;
                i--;
            }
        }
        }catch(e) {
            alert(e);
        }
    }
 
</SCRIPT>
</HEAD>
<BODY>
      <div class="msg"></div>
<form action="" method="post" name="f">
  <INPUT type="button" class="btn btn-success" value="Ajouter un autre produit" onClick="addRow('dataTable')" />
 
  <INPUT type="button" class="btn btn-danger" value="Supprimer le produit" onClick="deleteRow('dataTable')" />
 
 
<table class="table table-bordered table-striped table-condensed" width="1000" border="1">
<thead>
<tr>
<th width="40"></th>
<th width="40">ID</th>
<th width="40">Contact</th>
<th width="40">Référence Article</th>
<th width="40">Désignation Article</th>
<th width="40">Prix unitaire</th>
<th width="40">Unité</th>
<th width="40">Quantité</th>
<th width="40">Prix Net Unitaire</th>
</tr>
</thead>
<tbody id="dataTable">
 
</tbody>
</TABLE>
 
 
<INPUT type="submit" value="Insert" name="submit" />
</form>
</BODY>

script.js

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
 
$(document).ready(function(){
    $('.submit').click(function(){
      $.post('2.php', {
        devis_ref: $('devis_ref').val(),
        devis_contact: $('devis_contact').val(),
        devis_refarticle: $('devis_refarticle').val(),
        devis_designationarticle: $('devis_designationarticle').val(),
        devis_pu: $('devis_pu').val(),
        devis_unite: $('devis_unite').val(),
        devis_quantite: $('devis_quantite').val(),
        devis_prixnetunite: $('devis_prixnetunite').val()
        }, (resultDuScriptPHP) => {
           if (resultDuScriptPHP === 'ok') {
             $('.msg').append('<span>Vos données ont été envoyées</span>');
           } else if (resultDuScriptPHP === 'formNotComplete') {
             $('.msg').append('<span>Veuillez complétez tous les champs</span>');
           }
         });

2.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
23
24
25
26
27
<?php try { $bdd = new PDO('mysql:host=localhost;dbname=contact', 'root', '', array (PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES \'UTF8\''));}
catch (Exception $e) {
  die('Erreur : ' . $e->getMessage()) ; }
$bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
 
    if(isset($_POST['submit']))
      {
       foreach ($_POST['devis_ref'] as $key => $value)
          {
              $devis_ref = $_POST["devis_ref"][$key];
              $devis_contact = $_POST["devis_contact"][$key];
              $devis_refarticle = $_POST["devis_refarticle"][$key];
              $devis_designationarticle = $_POST["devis_designationarticle"][$key];
              $devis_pu = $_POST["devis_pu"][$key];
              $devis_unite = $_POST["devis_unite"][$key];
              $devis_quantite = $_POST["devis_quantite"][$key];
              $devis_prixnetunite = $_POST["devis_prixnetunite"][$key];
 
              $req = $bdd->prepare("INSERT INTO devis(devis_ref, devis_contact, devis_refarticle, devis_designationarticle, devis_pu, devis_unite, devis_quantite, devis_prixnetunite) VALUES(?,?,?,?,?,?,?,?)");
              $req->execute(array($devis_ref,$devis_contact,$devis_refarticle,$devis_designationarticle,$devis_pu,$devis_unite,$devis_quantite,$devis_prixnetunite));
           }
                resultDuScriptPHP === 'ok';
          }
         else {
                resultDuScriptPHP === 'formNotComplete';
          }
 ?>

merci!

Invité · 30/10/2018, 12h42

Bonjour,

Code :

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

$('devis_ref')......

erreur de syntaxe jQuery.

1- Soit avec le name :

Code :

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

$('input[name=devis_ref]')......

Pour les names comme name="devis_designationarticle[]" :

Code :

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

$('input[name^=devis_designationarticle]')......

Le "^" peut se traduire par "commencant par"

2- Soit en mettant des id aux input / select /...

Code :

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

<input id="devis_ref"....>

Code :

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

$('#devis_ref')......

A LIRE : Sélecteurs d'attribut

**Zarkoffe** · 30/10/2018, 12h59

merci pour ta réponse précise.
En effet je veux faire passer plusieurs lignes. Seulement, j'ai toujours cette fichue page qui se recharge sans insérer quoique ce soit, ni m'afficher mon span :/

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
 
$(document).ready(function(){
    $('.submit').click(function(){
      $.post('2.php', {
        devis_ref: $('input[name^=devis_ref]').val(),
        devis_contact: $('input[name^=devis_contact]').val(),
        devis_refarticle: $('input[name^=devis_refarticle]').val(),
        devis_designationarticle: $('input[name^=devis_designationarticle]').val(),
        devis_pu: $('input[name^=devis_pu]').val(),
        devis_unite: $('input[name^=devis_unite]').val(),
        devis_quantite: $('input[name^=devis_quantite]').val(),
        devis_prixnetunite: $('input[name^=devis_prixnetunite]').val()
        }, (resultDuScriptPHP) => {
           if (resultDuScriptPHP === 'ok') {
             $('.msg').append('<span>Vos données ont été envoyées</span>');
           } else if (resultDuScriptPHP === 'formNotComplete') {
             $('.msg').append('<span>Veuillez complétez tous les champs</span>');
           }
         });

Merci d'avance

Invité · 30/10/2018, 13h14

1- ATTENTION cependant : pour récupérer TOUTES les valeurs d'un champs "multiple" (avec des crochets []), il faut faire :

Code :

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

1
2
3
4
var devis_designationarticle = []; // array
$('input[name^=devis_designationarticle]').each(function() {
  devis_designationarticle.push($(this).val());
});

Pour récupérer des checkbox (cochées) :

Code :

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

1
2
3
4
var les_chexbox = []; // array
$('input[name^=les_chexbox]:checked').each(function() {
  les_chexbox.push($(this).val());
});

2- De manière beaucoup plus simple, on peut utiliser .serialize().

Code :

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

1
2
3
4
$( "form" ).on( "submit", function( event ) {
  event.preventDefault();
  console.log( $( this ).serialize() );
});

3- Pour éviter le rechargement, il faut "désactiver" la soumission du formulaire en empêchant le "comportement par défaut" : event.preventDefault()

event.preventDefault()

N.B. Remplace .click() par .on('click',...) :

Code :

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

    $('.submit').on('click', function( event ){

4- Enfin, LIS ou RELIS la DOC pour jQuery.post()
Notamment la gestion du résultat : .done(), .fail().

**Zarkoffe** · 30/10/2018, 15h16

Merci pour tes réponses. J'ai regardé la documentation Jquery et j'ai essayé les différentes manières que tu utilises mon récupérer tes variables.
Malheuresement je suis au même point qu'au départ, rien ne marche: ma page continue de se recharger malgrès "event.preventDefault();", rien ne s'insere, mon span ne fonctionne toujours pas.
voici mon script.js :

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
 
$(document).ready(function(){
    $( "form" ).on( "submit", function( event ) {
      $.post('2.php', {
          event.preventDefault();
          console.log( $( this ).serialize() );
        });
        }, (resultDuScriptPHP) => {
           if (resultDuScriptPHP === 'ok') {
             $('.msg').append('<span>Vos données ont été envoyées</span>');
           } else if (resultDuScriptPHP === 'formNotComplete') {
             $('.msg').append('<span>Veuillez complétez tous les champs</span>');
           }
             event.preventDefault();
         });

Merci d'avance

Invité · 30/10/2018, 15h28

Si tu ne respectes pas la syntaxe et la logique, tu n'arriveras a rien.

Commence par faire des exercices simples.

**Zarkoffe** · 30/10/2018, 15h46

Merci pour ta réponse. Je respecte pourtant bien la syntaxe il me semble :

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
26
27
28
29
30
31
32
33
34
35
36
 
$(document).ready(function(){
    $('.submit').on('click', function( event ){
      $.post('2.php', {
        devis_ref: $('input[name^=devis_ref]').each(function() {
  devis_ref.push($(this).val());
});
        devis_contact: $('input[name^=devis_contact]').each(function() {
  devis_contact.push($(this).val());
});
        devis_refarticle: $('input[name^=devis_refarticle]').each(function() {
  devis_refarticle.push($(this).val());
});
        devis_designationarticle: $('input[name^=devis_designationarticle]').each(function() {
  devis_designationarticle.push($(this).val());
});
        devis_pu: $('input[name^=devis_pu]').each(function() {
  devis_pu.push($(this).val());
});
        devis_unite: $('input[name^=devis_unite]').each(function() {
  devis_unite.push($(this).val());
});
        devis_quantite: $('input[name^=devis_quantite]').each(function() {
  devis_quantite.push($(this).val());
});
        devis_prixnetunite: $('input[name^=devis_prixnetunite]').each(function() {
  devis_prixnetunite.push($(this).val());
});
        }, (resultDuScriptPHP) => {
           if (resultDuScriptPHP === 'ok') {
             $('.msg').append('<span>Vos données ont été envoyées</span>');
           } else if (resultDuScriptPHP === 'formNotComplete') {
             $('.msg').append('<span>Veuillez complétez tous les champs</span>');
           }
         });
       } }

Merci

Invité · 30/10/2018, 16h22

Tant que tu ne maitriseras pas la syntaxe jQuery :

Envoyé par jreaux62

Commence par faire des exercices simples.

**Zarkoffe** · 30/10/2018, 16h42

J'ai appliqué la méthode mais cela ne marche pas, peux-tu me montrer à quel moment je ne respecte pas la syntaxe?

Invité · 31/10/2018, 17h17

Je répète alors :

Envoyé par jreaux62

Tant que tu ne maitriseras pas la syntaxe jQuery :
Commence par faire des exercices simples.

"exercices simples" veut dire "basiques", et progressifs.

Pour info : TOUT est faux.
Et je ne suis pas là pour te donner un cours d'Ajax.

Et te donner la solution ne t'apprendra rien.

**Zarkoffe** · 12/11/2018, 12h53

Tout est faux? Bizarre, j'arrive à insérer une seule ligne, afficher un span, et récupérer les messages en direct.
Ca doit pas être si faux que ça. Seulement avec plusieurs lignes, quelque(s) chose(s) bloquent.

Si quelqu'un a une idée, je suis preneur. Merci

**Zarkoffe** · 12/11/2018, 15h17

J'ai surtout l'impression que tu n'as pas la moindre idée de comment résoudre mon pb.
Tu me parles de gérer par id ou name, j'essaye ça marche pas.
Tu me parles de passer par un "event.preventDefault();" pour éviter le rechargement : mon code qui fonctionne dynamiquement ne recharge pas la page, insert mes données et n'utilise pas du tout cette fonction.
Je demande pas la réponse toute cuite, mais au moins un "regarde sur cette page", "regarde de ce côté, tu auras un élément de réponse" plutôt que "lis le cours" que j'ai déjà lu 40 fois et qui ne m'aide pas. Car je n'ai aucune erreur de syntaxe, car je la respecte, sinon j'en aurai.
C'est pour ça que je viens demander de l'aide.

Merci d'avance

Invité · 12/11/2018, 15h25

Plus le code est complexe, plus les causes/sources possibles d'erreurs sont nombreuses.

En simplifiant le code à sa forme la plus simple, on peut éliminer une cause après l'autre.

Dans ton autre discussion, tu n'as fait que rendre ton code encore plus complexe.
Donc, tu as augmenté les causes possibles d'erreur.

Par conséquent, tu as raison : je ne sais pas ce qui cloche dans ton code (car JE NE PEUX PAS le TESTER).

Mais j'ai donné une méthode pour que TU réussisses à cibler l'erreur :

en SIMPLIFIANT, pour obtenir un code fonctionel,
et en augmentant la difficulté/complexité au fur et à mesure, jusqu'à ce que le code ne fonctionne plus.
enfin, on peut CIBLER l'erreur.

Cette méthode est à la base même du débogage.

N.B. Je n'ai pas dit "lis le cours".
J'ai dit "Fais des exercices simples".

**Zarkoffe** · 12/11/2018, 15h40

Merci pour ton conseil, mais mon code est déjà au plus simple possible.
Le seul truc que j'aurai pu faire, c'est mettre moins d’éléments à insérer. Enfin si ça marche avec 2 ça marche avec 7.

**SpaceFrog** · 12/11/2018, 17h43

J'ai surtout l'impression que tu n'as pas la moindre idée de comment résoudre mon pb.

Désolé je n'ai pas pu m'empêcher de pouffer ...

Invité · 12/11/2018, 18h13

Envoyé par Zarkoffe

...J'ai surtout l'impression que tu n'as pas la moindre idée de comment résoudre mon pb...

En réalité, ça fait longtemps que j'ai donné la solution : ICI.
Tu n'as pas su l'utiliser...

Dans le message suivant, tu écris dans ton code :

Code :

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

          console.log( $( this ).serialize() );

A AUCUN MOMENT, tu nous as MONTRÉ ce que ça donne !!!
Tu te contentes de dire "ça ne fonctionne pas"....

"ça ne fonctionne pas", "ça ne marche pas",.... : ça n'apporte AUCUNE information utile !

La voilà, ta solution :

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
$(document).ready(function(){
	$('.submit').on('click', function( event ){
		event.preventDefault();
		// ----------
		// on récupère toutes les valeurs
		var devis_ref = []; // array
		$('input[name^=devis_ref]').each(function() {
			devis_ref.push($(this).val());
		});
		devis_ref = JSON.stringify(devis_ref); // JSON.stringify() convertit une valeur JavaScript en chaîne JSON
 
   console.log( devis_ref ); // DEBUG : on VERIFIE ce que ça contient !)
 
		// ... (et ainsi de suite pour les autres) ...
 
		// ----------
		$.post('2.php', {
			devis_ref: devis_ref,
			devis_contact: devis_contact,
			...
		});
		// ----------
	});
});

Pouf Pouf...

**Zarkoffe** · 12/11/2018, 18h25

Merci pour ta réponse.
Je disais que ça ne marchait pas, que je n'avais pas d'erreur : j'attendais surtout que vous me disiez comment afficher les erreurs dans le cas qui était le miens.
J'ai essayé ton code, ben je vais redire la même chose : pas d'erreur dans la console, et ça ne marche pas.
Merci d'avance.

1.php

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
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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
 
<?php include 'connection.php' ; ?>
<HTML>
  <HEAD>
  <meta charset="utf-8">
  <title>Poster en ajax</title>
  <link rel="stylesheet" href="ajax.css">
  <script src="jquery.min.js"></script>
  <script src="script.js"></script>
 
 
<TITLE> Add/Remove dynamic rows in HTML table </TITLE>
 
<SCRIPT language="javascript">
function addRow(tableID) {
 
      var table = document.getElementById(tableID);
 
      var rowCount = table.rows.length;
      var row = table.insertRow(rowCount);
 
      var cell1 = row.insertCell(0);
      var element1 = document.createElement("input");
      element1.type = "checkbox";
      element1.name="chkbox[]";
      cell1.appendChild(element1);
 
      var cell2 = row.insertCell(1);
      cell2.innerHTML = "<input type='text' id='devis_ref[]' name='devis_ref[]' class='devis_ref[]' />";
 
      var cell3 = row.insertCell(2);
      cell3.innerHTML = "<input type='text'  id='devis_contact[]' name='devis_contact[]' class='devis_contact[]' />";
      //cell2.innerHTML = "<select name='item[]' id='facture_fournisseur' type='text' class='form-control'>< $list = $bdd->query('SELECT * FROM fournisseur');while ($data = $list->fetch()) { ?><option value='< echo $data['fournisseur_nom']; ?>'> < echo $data['fournisseur_nom']; ?></option>< } $list->closeCursor(); ?></select>";
 
      var cell4 = row.insertCell(3);
      cell4.innerHTML = "<input type='text' id='devis_refarticle[]' name='devis_refarticle[]' class='devis_refarticle[]' />";
 
      var cell5 = row.insertCell(4);
      cell5.innerHTML =  "<input type='text' id='devis_designationarticle[]' name='devis_designationarticle[]' class='devis_designationarticle[]' />";
 
      var cell6 = row.insertCell(5);
      cell6.innerHTML = "<input type='text' id='devis_pu[]' name='devis_pu[]' class='devis_pu[]' />";
 
      var cell7 = row.insertCell(6);
      cell7.innerHTML =  "<input type='text' id='devis_unite[]' name='devis_unite[]' class='devis_unite[]' />";
 
      var cell8 = row.insertCell(7);
      cell8.innerHTML = "<input type='text' id='devis_quantite[]'  name='devis_quantite[]' class='devis_quantite[]' />";
 
      var cell9 = row.insertCell(8);
      cell9.innerHTML =  "<input type='text' id='devis_prixnetunite[]' name='devis_prixnetunite[]' class='devis_prixnetunite[]' />";
      }
 
    function deleteRow(tableID) {
        try {
        var table = document.getElementById(tableID);
        var rowCount = table.rows.length;
 
        for(var i=0; i<rowCount; i++) {
            var row = table.rows[i];
            var chkbox = row.cells[0].childNodes[0];
            if(null != chkbox && true == chkbox.checked) {
                table.deleteRow(i);
                rowCount--;
                i--;
            }
        }
        }catch(e) {
            alert(e);
        }
    }
 
</SCRIPT>
</HEAD>
<BODY>
      <div class="msg"></div>
<form action="" method="post" name="f">
  <INPUT type="button" class="btn btn-success" value="Ajouter un autre produit" onClick="addRow('dataTable')" />
 
  <INPUT type="button" class="btn btn-danger" value="Supprimer le produit" onClick="deleteRow('dataTable')" />
 
 
<table class="table table-bordered table-striped table-condensed" width="1000" border="1">
<thead>
<tr>
<th width="40"></th>
<th width="40">ID</th>
<th width="40">Contact</th>
<th width="40">Référence Article</th>
<th width="40">Désignation Article</th>
<th width="40">Prix unitaire</th>
<th width="40">Unité</th>
<th width="40">Quantité</th>
<th width="40">Prix Net Unitaire</th>
</tr>
</thead>
<tbody id="dataTable">
 
</tbody>
</TABLE>
 
 
<INPUT type="submit" value="Insert" name="submit" />
</form>
</BODY>

script.js

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
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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
 
$(document).ready(function () {
  $('.submit').click(function ( event ) {
    event.preventDefault();
 
 
      var devis_ref = []; // array
      $('input[name^=devis_ref]').each(function() {
      devis_ref.push($(this).val()); });
      devis_ref = devis_ref.stringify();
      console.log( devis_ref );
 
      var devis_contact = []; // array
      $('input[name^=devis_contact]').each(function() {
        devis_contact.push($(this).val()); });
        devis_contact = devis_contact.stringify();
        console.log( devis_contact );
 
      var devis_refarticle = []; // array
      $('input[name^=devis_refarticle]').each(function() {
        devis_refarticle.push($(this).val()); });
        devis_refarticle = devis_refarticle.stringify();
        console.log( devis_refarticle );
 
      var devis_designationarticle = []; // array
      $('input[name^=devis_designationarticle]').each(function() {
        devis_designationarticle.push($(this).val()); });
        devis_designationarticle = devis_designationarticle.stringify();
        console.log( devis_designationarticle );
 
      var devis_pu = []; // array
      $('input[name^=devis_pu]').each(function() {
        devis_pu.push($(this).val()); });
        devis_pu = devis_pu.stringify();
        console.log( devis_pu );
 
 
      var devis_unite = []; // array
      $('input[name^=devis_unite]').each(function() {
        devis_unite.push($(this).val()); });
        devis_unite = devis_unite.stringify();
        console.log( devis_unite );
 
     var devis_quantite = []; // array
      $('input[name^=devis_quantite]').each(function() {
        devis_quantite.push($(this).val()); });
        devis_quantite = devis_quantite.stringify();
        console.log( devis_quantite );
 
     var devis_prixnetunite = []; // array
      $('input[name^=devis_prixnetunite]').each(function() {
        devis_prixnetunite.push($(this).val()); });
        devis_prixnetunite = devis_prixnetunite.stringify();
        console.log( devis_prixnetunite );
 
        $.post('2.php', {
          devis_ref: devis_ref,
          devis_contact: devis_contact,
          devis_refarticle: devis_refarticle,
          devis_designationarticle: devis_designationarticle,
          devis_pu: devis_pu,
          devis_unite: devis_unite,
          devis_quantite: devis_quantite,
          devis_prixnetunite: devis_prixnetunite
 
        });
 
      });
    });

2.php

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
26
27
28
29
30
31
32
33
 
<?php try { $bdd = new PDO('mysql:host=localhost;dbname=contact', 'root', '', array (PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES \'UTF8\''));}
catch (Exception $e) {
  die('Erreur : ' . $e->getMessage()) ; }
$bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
 
$resultDuScriptPHP = null;
 
    if(isset($_POST['submit']))
      {
       foreach ($_POST['devis_ref'] as $key => $value)
          {
              $devis_ref = $_POST["devis_ref"][$key];
              $devis_contact = $_POST["devis_contact"][$key];
              $devis_refarticle = $_POST["devis_refarticle"][$key];
              $devis_designationarticle = $_POST["devis_designationarticle"][$key];
              $devis_pu = $_POST["devis_pu"][$key];
              $devis_unite = $_POST["devis_unite"][$key];
              $devis_quantite = $_POST["devis_quantite"][$key];
              $devis_prixnetunite = $_POST["devis_prixnetunite"][$key];
 
              $req = $bdd->prepare("INSERT INTO devis(devis_ref, devis_contact, devis_refarticle, devis_designationarticle, devis_pu, devis_unite, devis_quantite, devis_prixnetunite) VALUES(?,?,?,?,?,?,?,?)");
              $req->execute(array($devis_ref,$devis_contact,$devis_refarticle,$devis_designationarticle,$devis_pu,$devis_unite,$devis_quantite,$devis_prixnetunite));
           }
                $resultDuScriptPHP = 'ok';
                echo $resultDuScriptPHP;
          }
         else {
                $resultDuScriptPHP = 'formNotComplete';
                die("Unable to insert the data");
          }
      ?>
<br>

Invité · 12/11/2018, 18h35

Maintenant, je t'explique ce que c'est qu'un EXERCICE SIMPLE...

Je vais TESTER, avec un code MINIMAL, si ce que j'ai écrit ci-dessus convient : https://codepen.io/jreaux62/pen/NEdzKJ

Code html :

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

1
2
3
4
5
6
7
<form>
  <p><input type="text"  name="devis_ref[]" /></p>
  <p><input type="text"  name="devis_ref[]" /></p>
  <p><input type="text"  name="devis_ref[]" /></p>
 
  <p><input type="submit" class="submit" value="OK"/></p>
</form>

Code JavaScript :

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
 
$(document).ready(function(){
	$('.submit').on('click', function( event ){
		event.preventDefault();
		// ----------
		// on récupère toutes les valeurs
		var devis_ref = []; // array
		$('input[name^=devis_ref]').each(function() {
			devis_ref.push($(this).val());
		});
 console.log( 'avant:'+devis_ref ); // on VERIFIE ce que ça contient !)
		devis_ref = JSON.stringify(devis_ref); // JSON.stringify() convertit une valeur JavaScript en chaîne JSON
 console.log( 'après:'+devis_ref ); // on VERIFIE ce que ça contient !)
 
		// ----------
	});
});

C'est plus CLAIR comme ça ?

Invité · 12/11/2018, 18h45

Un autre EXERCICE SIMPLE, pour TESTER serialize() :

Code html :

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

1
2
3
4
5
6
7
<form>
  <p><input type="text"  name="devis_ref[]" /></p>
  <p><input type="text"  name="devis_ref[]" /></p>
  <p><input type="text"  name="devis_ref[]" /></p>
 
  <p><input type="submit" class="submit" value="OK"/></p>
</form>

Code JavaScript :

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

1
2
3
4
5
6
7
8
$(document).ready(function(){
	$('.submit').on('click', function( event ){
		event.preventDefault();
		// ----------
    var datas = $( this ).closest('form').serialize(); // on remonte sur le <form>
 console.log( 'datas: '+datas ); // on VERIFIE ce que ça contient !)
	});
});

Pour info :
J'ai d'abord TESTE avec :

Code :

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

    var datas = $( this ).serialize();

ça ne donnait pas de résultat. En effet, la classe ".submit" est appliquée sur l'input.
Or serialize agit sur le <form>!
Donc, j'ai CORRIGE :

Code :

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

    var datas = $( this ).closest('form').serialize();

C'est CA, faire des EXERCICES SIMPLES.

**Zarkoffe** · 12/11/2018, 18h48

Je débute les gars, vous faites peut-être ça depuis 30 ans mais pour ma part ça se compte en semaines.
Vous êtes peut-être bons, mais très peu pédagogue (humour).

Ne vous prenez pas la tête d'avantage, on a essayé je ne sais combien de choses toutes l'aprem, je vais me débrouiller, vous embêtez pas pour moi.
En tout cas, le PHP c'était mille fois plus ludique que cette merde de javascript. C'est incroyable ce language, quelle plaie sérieusement :o
Merci pour tout et bonne fin de journée à vous

PS : voir mon poste précédent, je l'ai modifié, pour dire que le code me faisait la même chose que j'avais au point de départ.

Insertion SQL dynamique + SPAN success

jQuery

Discussions similaires

Partager

Partager