Discussion :

[W.ided123]

Bonjour,

J'ai une problématique qui est la suivante: je veux avoir un tableau des champ et lorsqu'on s'appuie sur un bouton en ajoute une ligne autre ligne vide semblable à la ligne précédente et puis avoir un bouton submit qui fait l'insertion des tous les données saisies dans la base de données. C'est pour mon application web dynamique svp aidez moi

Voici le code du mon tableau

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
<table class="dTable" id="matable"> 
 <thead> <tr> <th> <div align="center"> Code Article </div> </th> 
              <th> <div align="center"> Article </div> </th> 
			  <th> <div align="center"> D&eacutesignation </div> </th> 
			  <th> <div align="center"> Num&eacutero de S&eacuterie </div> </th> 
			  <th> <div align="center"> Version </div> </th>
              <th> <div align="center"> Famille </div> </th> 
              <th> <div align="center"> Emplacement </div> </th> 
 
 </tr> </thead> 
<tfoot>  </tfoot> 
<tbody> <tr> <td> <div align="center"> <input type="text" name="Code_Article"/> </div> </td> 
             <td> <div align="center"> <input type="text" name="Article"/> </div> </td> 
             <td> <div align="center"> <input type="text" name="Designation"/> </div> </td> 
			 <td> <div align="center"> <input type="text" name="Numero_Serie"/> </div> </td> 
			 <td> <div align="center"> <input type="text" name="Version"/> </div> </td> 
			 <td> <div align="center"> <select name="Famille"><option></option>
			 <option></option>
			 <OPTION></OPTION>  </select> </div> </td>
			 <td> <div align="center"> <input type="text" name="Emplacement"/> </div> </td> 
 
</tr> </tbody> </table>

et voici le code pour ajout des champs à ma base des données

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
 <?php 
session_start(); 
 
// On intègre les informations de connexion à la base de données ainsi que le fichier 
 
include("conf_site.php");
include("fonctions.php");
// On intialise la connexion à la base de données
$bdd = new PDO('mysql:host='.$bdd_hote.';dbname='.$bdd_nmDB, $bdd_user, $bdd_pass);
$Numero_Bon_Entree=$_SESSION['Bon_Entree_N'];
$Numero_Serie=htmlentities(trim($_POST['Numero_Serie']));
$Code_Article=htmlentities (trim($_POST['Code_Article']));
$Carte=htmlentities(trim($_POST['Article']));
$Famille=htmlentities(trim($_POST['Famille']));
$Emplacement=htmlentities(trim($_POST['Emplacement']));
$Version=htmlentities(trim($_POST['Version']));
$Designation=htmlentities(trim($_POST['designation']));
if($Code_Article&&$Numero_Serie){
$requete="INSERT INTO `articles` (`Numero_Serie`, `Code_Article`,`Carte`,`Famille`,`Emplacement`, `Version`, `Designation`,`Numero_Bon_Entree`) VALUES ('$Numero_Serie','$Code_Article', '$Carte','$Famille','$Emplacement','$Version','$Designation','$Numero_Bon_Entree' );";
sql($requete);
 session_start();
$_SESSION['ok2']="ok";
header('location:bon_d\'entree2.php');
}
else { header ('location:bon_d\'entree2_erreur.php'); }
?>

Merci de votre aide.

[Spartacusply]

Utilise la possibilité du html d'utiliser les tableaux dans les names de tes input pour rassembler les éléments qui correspondent au même article.

Code html :

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

1
2
3
4
<input type="text" name="article[0][Code_Article]"/> 
<input type="text" name="article[0][Article]"/>
<input type="text" name="article[][Designation]"/>
// etc...

Tu peux créer de nouveaux articles en javascript (ou mieux utilise jquery ce sera plus simple) :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
    // En ayant créé un bouton avec l'id "ajouterArticle" dans ton html
    var nbArticle = 0;
 
    $('#ajouterArticle').click(function() {
        nbArticle++;
        $('<input type="text" name="article[' + nbArticle + '][Code_Article]"/>' +
                '<input type="text" name="article[' + nbArticle + '][Article]"/>' +
                '<input type="text" name="article[' + nbArticle + '][Designation]"/>'
                // etc...
                ).prependTo($(this));
    });

Dans ton php, tu n'as plus qu'à boucler sur la requête qui sauvegarde les données, pour enregistrer chaque article qui aura été envoyé dans ton formulaire.

[W.ided123]

Merci pour votre aide spartacusply, j'ai fait comme tu as dit mais il y a encore le problème le bouton ne fonctionne pas.
Svp est ce que vous pouvez vérifier mon code:

Code html :

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

1
2
3
4
5
6
7
8
9
<tbody> <tr> <td> <div align="center"> <input type="text" name="article[0][Code_Article]"/> </div> </td> 
             <td> <div align="center"> <input type="text" name="article[0][Article]"/> </div> </td> 
             <td> <div align="center"> <input type="text" name="article[0][Designation]"/> </div> </td> 
			 <td> <div align="center"> <input type="text" name="article[0][Numero_Serie]"/> </div> </td> 
			 <td> <div align="center"> <input type="text" name="article[0][Version]"/> </div> </td> 
			 <td> <div align="center"> <select name="article[0][Famille]"><OPTION></OPTION>  </select> </div> </td>
			 <td> <div align="center"> <input type="text" name="article[0][Emplacement]"/> </div> </td> 
			 <td>  <input type="button" id="ajouterArticle" value="add"/> </td >
</tr> </tbody>

et j'ai tapé ce code pour la fonction javascript:

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
var nbArticle = 0;
 
    $('#ajouterArticle').click(function() {
        nbArticle++;
        $('<input type="text" name="article[' + nbArticle + '][Code_Article]"/>' +
                '<input type="text" name="article[' + nbArticle + '][Article]"/>' +
                '<input type="text" name="article[' + nbArticle + '][Designation]"/>'+
                '<input type="text" name="article[' + nbArticle + '][Numero_Serie]"/>'+
				' <input type="text" name="article[' + nbArticle + '][Version]"/>' +
				'<select name="article[' + nbArticle + '][Famille]"><OPTION></OPTION>  </select>'+
				'<input type="text" name="article[' + nbArticle + '][Emplacement]"/>'
 
 
                ).prependTo($(this));
    });

Je m'excuse si mon code contient des erreurs mais c'est parce que je suis débutante dans le javascript
Merci d'avance

[Spartacusply]

As-tu bien importé la librairie jquery ? (http://jquery.com/download/#using-jquery-with-a-cdn)

Pour information, pour débugguer du javascript, c'est la touche F12 sous chrome, extension firebug sous firefox.

[W.ided123]

Désolé encore une fois comme je t'ai dit je suis encore débutante en développement web, je n'a pas compris ce qu'il me faut faire

[Spartacusply]

Je t'ai mis le lien direct pour savoir comment importer la librairie javascript :

Code :

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

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

[W.ided123]

J'ai essayé ça mais le problème reste encore, le bouton ne fonctionne pas

[Spartacusply]

J'ai oublié les balise englobantes.

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
$(function() {
var nbArticle = 0;
 
    $('#ajouterArticle').click(function() {
        nbArticle++;
        $('<input type="text" name="article[' + nbArticle + '][Code_Article]"/>' +
                '<input type="text" name="article[' + nbArticle + '][Article]"/>' +
                '<input type="text" name="article[' + nbArticle + '][Designation]"/>'+
                '<input type="text" name="article[' + nbArticle + '][Numero_Serie]"/>'+
				' <input type="text" name="article[' + nbArticle + '][Version]"/>' +
				'<select name="article[' + nbArticle + '][Famille]"><OPTION></OPTION>  </select>'+
				'<input type="text" name="article[' + nbArticle + '][Emplacement]"/>'
 
 
                ).prependTo($(this));
    });
});

Sers toi de la console pour voir ce genre d'erreur.

[W.ided123]

Dsl, mais le problème reste toujours, ça peut qu'il soit lors de l'appel de la fonction , ou peut être qu'il n'a pas reconnu le bouton malgré c'est pour le même id

[Spartacusply]

Erreur de ma part, remplace "prependTo" par "insertBefore" (subtilité entre les deux qui change tout).

[W.ided123]

Merci infiniment, c'était très utile et l'ajout du tableau fonctionne bien, mais svp est-ce qu'il est possible que vous m'aidez pour le code php de l'ajout à la base des données.

[Spartacusply]

Fais déjà un print_r($_POST);, tu pourras visualiser comment est construit ton tableau $_POST.

Il te faut boucler sur le tableau et faire une insertion par tour de boucle.

[W.ided123]

j'ai essayé avec ce code mais une erreur s'affiche: Column count doesn't match value count at row 1
Voici mon code:

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 
session_start(); 
// On intègre les informations de connexion à la base de données ainsi que le fichier 
include("conf_site.php");
include("fonctions.php");
// On intialise la connexion à la base de données
$bdd = new PDO('mysql:host='.$bdd_hote.';dbname='.$bdd_nmDB, $bdd_user, $bdd_pass);
$Numero_Bon_Entree=$_SESSION['Bon_Entree_N'];
$value=''; 
$i=0; 
while(isset($_POST['article'][++$i]['Numero_Serie']))
{ $value.="('', 
'".mysql_real_escape_string($_POST['article'][$i]['Numero_Serie'])."','".mysql_real_escape_string($_POST['article'][$i]['Code_Article'])."','".mysql_real_escape_string($_POST['article'][$i]['Article'])."','".mysql_real_escape_string($_POST['article'][$i]['Famille'])."','".mysql_real_escape_string($_POST['article'][$i]['Version'])."','".mysql_real_escape_string($_POST['article'][$i]['Emplacement'])."','".mysql_real_escape_string($_POST['article'][$i]['Designation'])."','".$Numero_Bon_Entree."')";}
$value=substr($value,0,-1); 
mysql_query("INSERT INTO `article` (`Numero_Serie`, `Code_Article`,`Carte`,`Famille`,`Version`, `Emplacement`, `Designation`,`Numero_Bon_Entree`) VALUES ('".$value."')") or die (mysql_error());
?>