Récupération de données d'un formulaire PHP/JavaScript

Résolu
slefevre77 Messages postés 34 Statut Membre -  
jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   -
Bonjour,

J'ai récupéré et adapté à mes besoins des bouts de code afin de me créer un site de gestion de mes vidéos.
Je souhaite intégrer des infos sur des acteurs et pour cela je constitue un formulaire PHP, mais je souhaite pouvoir ajouter dynamiquement des lignes à la volée à ce formulaire.
Cette partie fonctionne correctement.

Mais mon problème est que je ne sais pas comment récupérer les données du formulaire dans une autre page PHP (sur la même page non plus d'ailleurs).

Je pense qu'il faut faire un tableau avec les variables, mais je ne sais pas comment faire.

Je vous joins le code, il est constitué de :

- une page pour le formulaire : formulaire.php
- une page javascript associée au formulaire : javascript.js
- et de la page où je souhaite récupérer les données : recup_donnees.php

Par avance merci pour votre aide.

formulaire.php : 

<!DOCTYPE html>
<html>
 <head>
  <meta charset=UTF-8" />
  <title>My VidéoThèque</title>
 </head>

 <body>
  <div align="center">
     <h1>Formulaire de récupération de données</h1>

  <form id="form_acteurs" action="/recup_donnees.php">
   <table id="acteurs">
    <thead>
     <tr>
      <th>Prénom</th>
      <th>Nom</th>
      <th>Date de naissance</th>
      <th>URL photo</th>
 
      <th>Actions</th>
     </tr>
    </thead>
     
    <tfoot>
     <tr>
      <td colspan="4"><button type="button" id="ajouter_ligne">Ajouter une ligne</button></td>
     </tr>
    </tfoot>
 
    <tbody>
    </tbody>
   </table>
   <p class="submit">
    <button type="button" id="modifier" disabled="disabled">Modifier</button>
    <button type="submit" id="valider" class="important">Valider</button>
   </p>
  </form>

  <input type="button" onclick="send_data()" value="Envoyer les données">
 </div>

 <script src="javascript.js"></script>

</body>
</html>


javascript.js : 

(function (){
 var champs = [
  "prenom",
  "nom",
  "date_de_naissance",
  "url_photo"
 ],

 modifier = document.getElementById("modifier"),
 valider = document.getElementById("valider"),
 ajouter_ligne = document.getElementById("ajouter_ligne"),
 table = document.getElementById("acteurs"),
 form = document.getElementById("form_acteurs");

 function action_valider (){
  champs_disabled(true);
  valider.disabled = true;
  modifier.disabled = false;
 }
 
 function action_modifier (){
  champs_disabled(false);
  valider.disabled = false;
  modifier.disabled = true;
 }

 function champs_disabled (disabled) {
  var i,c = table.tBodies[0].getElementsByTagName("input"),
  l = c.length;
  for (i = 0; i < l; i++) {
   c[i].disabled = disabled;
  }
 }

 form.onsubmit = function (){return false;}
 modifier.onclick = action_modifier;
 valider.onclick = action_valider;
 
 ajouter_ligne.onclick = function (){
  var i, supprimer,
  tbody = table.tBodies[0],
  ligne = tbody.insertRow(-1);

  function champ (name, value) {
   var t = document.createElement("input");
   t.type = "text";
   t.name = t.id = name +"[]";
   t.value = value || "";
        return t;
  }

  for (i = 0; i < champs.length; i++) {
   (ligne.insertCell(i)).appendChild(champ(champs[i]));
  }

  supprimer = document.createElement("button");
  supprimer.type = "button";
  supprimer.className = "del";
  supprimer.innerHTML = "×";
  supprimer.onclick = function (){
   var tr = this.parentNode.parentNode;
   index = tr.sectionRowIndex;
   tbody.deleteRow(index);
   valider.disabled = false;
   modifier.disabled = true;
  };
 
  i = ligne.insertCell(champs.length);
  i.className = "actions";
  i.appendChild(supprimer);

  var n, nt, inputs, index;
  for (var n = 0, nt = tbody.rows.length; n < nt; n++) {
   inputs = tbody.rows[n].getElementsByTagName("input");
   index = tbody.rows[n].sectionRowIndex;
   for (var nn = 0, ntn = inputs.length; nn < ntn; nn++) {
    inputs[nn].id = inputs[nn].name = inputs[nn].name.replace(/\[\d*\]$/, "["+index+"]");
   }
  }
 
  valider.disabled = false;
  modifier.disabled = true;
 };
})();


recup_donnees.php : 


<!DOCTYPE html>
<html>
 <head>
  <meta charset=UTF-8" />
  <title>My VidéoThèque</title>
 </head>

 <body>
  <div align="center"><b><center>Récupération des données et ajout à la base de données</center></b></div>
    <?php
     print_r $array;
     // Je traiterais le tableau de données quand cela fonctionnera :-)
    ?>


Encore merci pour votre aide.

Sébastien

Configuration: Windows / Firefox 94.0

29 réponses

  • 1
  • 2
Résumé de la discussion

La problématique porte sur la récupération des données d'un formulaire PHP qui permet d'ajouter dynamiquement des lignes pour saisir des acteurs et d'envoyer ces données sur une page distincte. La solution pédagogique évoquée privilégie des noms de champs en tableaux (prenom[], nom[], date_de_naissance[], url_photo[]) et une méthode POST pour récupérer chaque valeur côté serveur. Des conseils portent également sur l'utilisation d'input type date pour les dates, la gestion de l'envoi avec un bouton dédié et la lecture de $_POST pour parcourir les tableaux et traiter chaque ligne. En pratique, il est courant de vérifier l'existence des tableaux et d'itérer sur leur taille pour assembler les données à traiter dans la base.

Généré automatiquement par IA
sur la base des meilleures réponses
  1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Bonjour

    Envoie ton form en POST 
    <form id="form_acteurs" action="/recup_donnees.php" method="post">


    Et pour récupérer les données.. regarde ce que contient la variable $_POST
    0
  2. slefevre77 Messages postés 34 Statut Membre
     
    Bonjour,

    Merci pour ta réponse, j'ai raouté : method="post", mais il ne se passe rien quand j'appuie sur le bouton "Envoyer les données".
    C'est la fonction qui ne fonctionne pas, je ne sais pas la créer correctement.
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      Faut enlever 
      form.onsubmit = function (){return false;}
      0
  3. slefevre77 Messages postés 34 Statut Membre
     
    Merci, un grand pas en avant pour moi. Le formulaire est bien envoyé.

    Par contre comment je récupère les données ?
    Je ne comprends pas le nom de la variable ? de l'Array ?

    print_r (quel est le nom de la variable ?);
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      Je t'ai dit ...regarde ce que contient la variable $_POST

      vu que tu as des inputs dont le NAME est : "name[]"
      tu vas avoir, dans $_POST une variable "name" qui sera elle même un array contenant chaque valeur de cet input ..

      NB: Si tu ne sais pas ce qu'est un array associatif / indexé ..ni comment manipuler ce type d'array en php, commence par te former la dessus..avant de poursuivre l'écriture de ton code
      0
  4. slefevre77 Messages postés 34 Statut Membre
     
    print_r ($_POST);

    Ça affiche :

    Array ( )

    Et je viens de voir que c'est le bouton valider qui envoie le formulaire, mais le bouton "Envoyer les données ne fonctionne pas"!
    0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Si on reprend ton code 
     <input type="button" onclick="send_data()" value="Envoyer les données">

    Le bouton fait appel à une fonction send_data()

    Fonction qui ne semble pas exister dans ton code js ..

    Et d'un autre côté tu as le bouton 
    <button type="submit" id="valider" class="important">Valider</button>

    qui lui, fait un SUBMIT de ton formulaire.. et donc qui doit bien envoyer les données de ton formulaire ..

    0
  7. slefevre77 Messages postés 34 Statut Membre
     
    Avec ton remarques, j'ai modifié le formulaire comme suit : 

     <p class="submit">
  <button type="button" id="modifier" disabled="disabled">Modifier</button>
  <button type="button" id="valider" class="important">Valider</button>
  <br/><br/>
  <button type="submit" id="send_data" class="important">Envoyer les données</button>
 </p>
</form>

    </code>

    Et le fichier javascript.ps comme suit : 

    (function (){
 var champs = [
  "prenom",
  "nom",
  "date_de_naissance",
  "url_photo"
 ],

 modifier = document.getElementById("modifier"),
 valider = document.getElementById("valider"),
 send_data = document.getElementById("send_data"),
 ajouter_ligne = document.getElementById("ajouter_ligne"),
 table = document.getElementById("acteurs"),
 form = document.getElementById("form_acteurs");

 function action_valider (){
  champs_disabled(true);
  valider.disabled = true;
  modifier.disabled = false;
 }
 
 function action_send_data(){
  champs_disabled(true);
  valider.disabled = true;
  modifier.disabled = false;
 }
 
 function action_modifier (){
  champs_disabled(false);
  valider.disabled = false;
  modifier.disabled = true;
 }

 function champs_disabled (disabled) {
  var i,c = table.tBodies[0].getElementsByTagName("input"),
  l = c.length;
  for (i = 0; i < l; i++) {
   c[i].disabled = disabled;
  }
 }

 //form.onsubmit = function (){return false;}
 modifier.onclick = action_modifier;
 valider.onclick = action_valider;
 send_data.onclick = action_send_data;
 
 ajouter_ligne.onclick = function (){
  var i, supprimer,
  tbody = table.tBodies[0],
  ligne = tbody.insertRow(-1);

  function champ (name, value) {
   var t = document.createElement("input");
   t.type = "text";
   t.name = t.id = name +"[]";
   t.value = value || "";
        return t;
  }

  for (i = 0; i < champs.length; i++) {
   (ligne.insertCell(i)).appendChild(champ(champs[i]));
  }

  supprimer = document.createElement("button");
  supprimer.type = "button";
  supprimer.className = "del";
  supprimer.innerHTML = "×";
  supprimer.onclick = function (){
   var tr = this.parentNode.parentNode;
   index = tr.sectionRowIndex;
   tbody.deleteRow(index);
   valider.disabled = false;
   modifier.disabled = true;
  };
 
  i = ligne.insertCell(champs.length);
  i.className = "actions";
  i.appendChild(supprimer);

  var n, nt, inputs, index;
  for (var n = 0, nt = tbody.rows.length; n < nt; n++) {
   inputs = tbody.rows[n].getElementsByTagName("input");
   index = tbody.rows[n].sectionRowIndex;
   for (var nn = 0, ntn = inputs.length; nn < ntn; nn++) {
    inputs[nn].id = inputs[nn].name = inputs[nn].name.replace(/\[\d*\]$/, "["+index+"]");
   }
  }
 
  valider.disabled = false;
  modifier.disabled = true;
 };
})();


    Maintenant tous les boutons sont opérationnels, mais je ne récupère toujours aucune donnée dans $_POST.

    Array ( )
    0
  8. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Déjà,
    merci de bien vouloir indiquer le langage dans les balises de code afin que l'on ai la coloration syntaxique
    Explications ( à lire entièrement) disponibles ici :https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

    Ensuite, il faudrait nous montrer
    1 - Le code source de la page générée ( tu affiches la page dans ton navigateur, puis tu affiches son code source via la raccourci CTRL + u et tu le copie/colle ici )

    2 - Le code PHP que tu as écrit exactement..
    0
  9. slefevre77 Messages postés 34 Statut Membre
     
    Désolé pour les balises de code, je reprends :

    formulaire.php : 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset=UTF-8" />
		<title>My VidéoThèque</title>
	</head>

	<body>
		<div align="center"><h1>Formulaire de récupération de données</h1>

			<form id="form_acteurs" action="/ajout_formulaire.php" method="post">
	
			<table id="acteurs">
				<thead>
					<tr>
						<th>Prénom</th>
						<th>Nom</th>
						<th>Date de naissance</th>
						<th>URL photo</th>
				
						<th>Actions</th>
					</tr>
				</thead>
					
				<tfoot>
					<tr>
						<td colspan="4"><button type="button" id="ajouter_ligne">Ajouter une ligne</button></td>
					</tr>
				</tfoot>
				
				<tbody>
				</tbody>
			</table>
			<p class="submit">
				<button type="button" id="modifier" disabled="disabled">Modifier</button>
				<button type="button" id="valider" disabled="disabled">Valider</button>
			<br/><br/>
				<button type="submit" id="send_data" class="important">Envoyer les données</button>
			</p>
			</form>
		</div>
		<script src="javascript_5.js"></script>
	</body>
</html>


    javascript.js : 

    (function (){
	var champs = [
		"prenom",
		"nom",
		"date_de_naissance",
		"url_photo"
	],

	modifier = document.getElementById("modifier"),
	valider = document.getElementById("valider"),
	send_data = document.getElementById("send_data"),
	ajouter_ligne = document.getElementById("ajouter_ligne"),
	table = document.getElementById("acteurs"),
	form = document.getElementById("form_acteurs");

	function action_valider (){
		champs_disabled(true);
		valider.disabled = true;
		modifier.disabled = false;
	}
	
	// Ce que j'ai rajouté ici mais qui ne fonctionne pas et ne sert donc à rien
	function action_send_data(){
		champs_disabled(true);
		valider.disabled = true;
		modifier.disabled = false;
	}
	
	function action_modifier (){
		champs_disabled(false);
		valider.disabled = false;
		modifier.disabled = true;
	}

	function champs_disabled (disabled) {
		var i,c = table.tBodies[0].getElementsByTagName("input"),
		l = c.length;
		for (i = 0; i < l; i++) {
			c[i].disabled = disabled;
		}
	}

	//form.onsubmit = function (){return false;}
	modifier.onclick = action_modifier;
	valider.onclick = action_valider;
	send_data.onclick = action_send_data;
	
	ajouter_ligne.onclick = function (){
		var i, supprimer,
		tbody = table.tBodies[0],
		ligne = tbody.insertRow(-1);

		function champ (name, value) {
			var t = document.createElement("input");
			t.type = "text";
			t.name = t.id = name +"[]";
			t.value = value || "";
        return t;
		}

		for (i = 0; i < champs.length; i++) {
			(ligne.insertCell(i)).appendChild(champ(champs[i]));
		}

		supprimer = document.createElement("button");
		supprimer.type = "button";
		supprimer.className = "del";
		supprimer.innerHTML = "×";
		supprimer.onclick = function (){
			var tr = this.parentNode.parentNode;
			index = tr.sectionRowIndex;
			tbody.deleteRow(index);
			valider.disabled = false;
			modifier.disabled = true;
		};
 
		i = ligne.insertCell(champs.length);
		i.className = "actions";
		i.appendChild(supprimer);

		var n, nt, inputs, index;
		for (var n = 0, nt = tbody.rows.length; n < nt; n++) {
			inputs = tbody.rows[n].getElementsByTagName("input");
			index = tbody.rows[n].sectionRowIndex;
			for (var nn = 0, ntn = inputs.length; nn < ntn; nn++) {
				inputs[nn].id = inputs[nn].name = inputs[nn].name.replace(/\[\d*\]$/, "["+index+"]");
			}
		}
 
		valider.disabled = false;
		modifier.disabled = true;
	};
})();


    ajout_formulaire.php : 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset=UTF-8" />
		<title>My VidéoThèque</title>
	</head>

	<body>
		<div align="center"><h1>Récupération des données et ajout à la base de données</h1></div>

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


    Code PHP généré en ayant renseigné la première ligne : 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset=UTF-8" />
		<title>My VidéoThèque</title>
	</head>

	<body>
		<div align="center"><h1>Récupération des données et ajout à la base de données</h1></div>

		Array
(
)
	</body>
</html>


    Rien n'est envoyé.
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      C'est le code généré de la page formulaire.php ( après que tu aies ajoutés des input dedans ) qu'il nous faut
      0
  10. slefevre77 Messages postés 34 Statut Membre
     
    Voici le code de formulaire, en ayant renseigné des inputs, avant d'appuyer sur le bouton "Envoyer les données" : 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset=UTF-8" />
		<title>My VidéoThèque</title>
	</head>

	<body>
		<div align="center"><h1>Formulaire de récupération de données</h1>

			<form id="form_acteurs" action="/ajout_formulaire.php" method="post">
	
			<table id="acteurs">
				<thead>
					<tr>
						<th>Prénom</th>
						<th>Nom</th>
						<th>Date de naissance</th>
						<th>URL photo</th>
				
						<th>Actions</th>
					</tr>
				</thead>
					
				<tfoot>
					<tr>
						<td colspan="4"><button type="button" id="ajouter_ligne">Ajouter une ligne</button></td>
					</tr>
				</tfoot>
				
				<tbody>
				</tbody>
			</table>
			<p class="submit">
				<button type="button" id="modifier" disabled="disabled">Modifier</button>
				<button type="button" id="valider" disabled="disabled">Valider</button>
			<br/><br/>
				<button type="submit" id="send_data" class="important">Envoyer les données</button>
			</p>
			</form>
		</div>
		<script src="javascript.js"></script>
	</body>
</html>


    On n'y voit pas les infos renseignées !
    0
  11. slefevre77 Messages postés 34 Statut Membre
     
    Je pense qu'il manque quelque chose pour récolter et envoyer les données.

    Quelqu'un aurait une idée ?
    0
  12. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Déjà, il faut replacer le <tfoot> après le body.

    Ensuite, pourrais tu tester juste ce code ( sans essayer d'ajouter de nouvelle ligne par ton bouton) et voir (après avoir rempli les input) si tu as quelques chose dans la variable $_POST 
    <!DOCTYPE html>
<html>
	<head>
		<meta charset=UTF-8" />
		<title>My VidéoThèque</title>
	</head>
	<body>
		<div align="center"><h1>Formulaire de récupération de données</h1>

			<form id="form_acteurs" action="/ajout_formulaire.php" method="post">
			<table id="acteurs">
				<thead>
					<tr>
						<th>Prénom</th>
						<th>Nom</th>
						<th>Date de naissance</th>
						<th>URL photo</th>
						<th>Actions</th>
					</tr>
				</thead>
				<tbody>
          <tr>
            <td><input name="prenom[]"></td>
            <td><input name="nom[]"></td>
            <td><input name="date_de_naissance[]"></td>
            <td><input name="url_photo[]"></td>
            <td></td>
          </tr>
				</tbody>
        <tfoot>
          <tr>
            <td colspan="4"><button type="button" id="ajouter_ligne">Ajouter une ligne</button></td>
          </tr>
        </tfoot>
			</table>
			<p class="submit">
				<button type="button" id="modifier" disabled="disabled">Modifier</button>
				<button type="button" id="valider" disabled="disabled">Valider</button>
			<br/><br/>
				<button type="submit" id="send_data" class="important">Envoyer les données</button>
			</p>
			</form>
		</div>
		<script src="javascript_5.js"></script>
	</body>
</html>

    0
  13. slefevre77 Messages postés 34 Statut Membre
     
    Merci pour ta réponse, je viens de tester et cela ne change rien, aucune variable ni avant ni après l'envoi.
    Et le formulaire ne réagis plus pareil, il y a déjà une première ligne avant de cliquer sur "Ajouter une ligne", ce qui est plutôt bien, mais il est impossible de valider avant d'ajouter une ligne puis de la supprimer si elle est vide.

    code PHP généré avant envoi : 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset=UTF-8" />
		<title>My VidéoThèque</title>
	</head>
	<body>
		<div align="center"><h1>Formulaire de récupération de données</h1>

			<form id="form_acteurs" action="/ajout_formulaire.php" method="post">
			<table id="acteurs">
				<thead>
					<tr>
						<th>Prénom</th>
						<th>Nom</th>
						<th>Date de naissance</th>
						<th>URL photo</th>
						<th>Actions</th>
					</tr>
				</thead>
				<tbody>
          <tr>
            <td><input name="prenom[]"></td>
            <td><input name="nom[]"></td>
            <td><input name="date_de_naissance[]"></td>
            <td><input name="url_photo[]"></td>
            <td></td>
          </tr>
				</tbody>
        <tfoot>
          <tr>
            <td colspan="4"><button type="button" id="ajouter_ligne">Ajouter une ligne</button></td>
          </tr>
        </tfoot>
			</table>
			<p class="submit">
				<button type="button" id="modifier" disabled="disabled">Modifier</button>
				<button type="button" id="valider" disabled="disabled">Valider</button>
			<br/><br/>
				<button type="submit" id="send_data" class="important">Envoyer les données</button>
			</p>
			</form>
		</div>
		<script src="javascript.js"></script>
	</body>
</html>
    0
  14. slefevre77 Messages postés 34 Statut Membre
     
    Pour le bouton "Valider" qui était inactif, j'ai modifier comme ceci : 

    <button type="button" id="valider">Valider</button>


    J'ai donc supprimé : disabled="disabled"

    Et c'est bon, mais pas pour la récupération des infos.
    0
  15. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    A la place du code de ton formulaire actuel, pourrais tu juste mettre ceci : 
    <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title>My VidéoThèque</title>
	</head>
	<body>
	    <form id="form_acteurs" action="ajout_formulaire.php" method="post">

      <input type="text" name="prenom[]">
      <input type="text" name="nom[]">
      <input type="date" name="datenaissance[]">
      <input type="text" name="url[]">
      <button type="submit" name="send_data" class="important">Envoyer les données</button>
    </form>

  </body>
</html>


    Et dans le fichier ajout_formulaire.php 
    <?php

  echo "Valeurs contenues dans POST <br>";
  var_dump($_POST);

?>


    Tu renseignes des valeurs dans les input .. puis tu clique sur le bouton pour envoyer les données

    0
  16. slefevre77 Messages postés 34 Statut Membre
     
    Bonjour,

    Merci pour ta patience et ton aide précieuse, j'ai fait ce que tu m'as demandé, cela fonctionne bien :

    Valeurs contenues dans POST
    array(5) { ["prenom"]=> array(1) { [0]=> string(10) "Sébastien" } ["nom"]=> array(1) { [0]=> string(7) "DUPONT" } ["datenaissance"]=> array(1) { [0]=> string(10) "2021-12-08" } ["url"]=> array(1) { [0]=> string(13) "sebastien.jpg" } ["send_data"]=> string(0) "" }
    0
  17. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Maintenant, A la place du code de ton formulaire actuel, pourrais tu juste mettre ceci : 
    <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title>My VidéoThèque</title>
	</head>
	<body>
  
  <div align="center"><h1>Formulaire de récupération de données</h1>

	 <form id="form_acteurs" action="ajout_formulaire.php" method="post">   
      <table id="acteurs">
        <thead>
          <tr>
            <th>Prénom</th>
            <th>Nom</th>
            <th>Date de naissance</th>
            <th>URL photo</th>
            <th>Actions</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>
              <input type="text" name="prenom[]">
            </td>
            <td>
              <input type="text" name="nom[]">
            </td>
            <td>
              <input type="date" name="datenaissance[]">
            </td>
            <td>
              <input type="text" name="url[]">
            </td>
          </tr>
        </tbody>
        <tfoot>
          <tr>
            <td colspan="4">
              <button type="button" id="ajouter_ligne">Ajouter une ligne</button>
            </td>
          </tr>
        </tfoot>
      </table>
      <button type="submit" name="send_data" class="important">Envoyer les données</button>
     </form>
  </body>
</html>


    Tu remplis les input, tu cliques sur le bouton et tu regardes si tu as toujours tes variables POST

    Si ça fonctionne ,
    Ajoute ton script js avant le </body> 
    <script src="javascript.js"></script>

    puis tu testes à nouveau.

    Et si ça aussi c'est ok ...
    Tu cliques sur ajouter une nouvelle ligne ... tu remplis tous les input et tu regardes si ça marche.
    Si ça ne marche pas, dans ton navigateur, tu fais un clic droit ta page, dans le menu tu prends inspecter ( ou examiner selon le navigateur)
    et dans la barre de debug de ton navigateur tu cherches la ligne de code qui correspond à ton tableau. une fois trouvé, tu fais un clic droit et tu devrais avoir dans le menu un truc du genre editer html...
    Tu le fais puis tu copies/colles le résultat ici.

    0
  18. slefevre77 Messages postés 34 Statut Membre
     
    Désolé pour ma réponse tardive,

    C'est toujours OK, sans le javascript, je teste avec maintenant.
    0
  19. slefevre77 Messages postés 34 Statut Membre
     
    Donc avec le javascript, cela fonctionne toujours, le formulaire est bien envoyé, mais le bouton "Ajouter une ligne" ne fonctionne pas.

    Code PHP généré avant envoi : 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title>My VidéoThèque</title>
	</head>
	<body>
  
  <div align="center"><h1>Formulaire de récupération de données</h1>

	 <form id="form_acteurs" action="ajout_formulaire.php" method="post">   
      <table id="acteurs">
        <thead>
          <tr>
            <th>Prénom</th>
            <th>Nom</th>
            <th>Date de naissance</th>
            <th>URL photo</th>
            <th>Actions</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>
              <input type="text" name="prenom[]">
            </td>
            <td>
              <input type="text" name="nom[]">
            </td>
            <td>
              <input type="date" name="datenaissance[]">
            </td>
            <td>
              <input type="text" name="url[]">
            </td>
          </tr>
        </tbody>
        <tfoot>
          <tr>
            <td colspan="4">
              <button type="button" id="ajouter_ligne">Ajouter une ligne</button>
            </td>
          </tr>
        </tfoot>
      </table>
      <button type="submit" name="send_data" class="important">Envoyer les données</button>
     </form>
	 <script src="javascript.js"></script>
  </body>
</html>


    Valeurs contenues dans POST
    array(5) { ["prenom"]=> array(1) { [0]=> string(10) "Sébastien" } ["nom"]=> array(1) { [0]=> string(7) "TEST" } ["datenaissance"]=> array(1) { [0]=> string(10) "2021-12-24" } ["url"]=> array(1) { [0]=> string(13) "sebastien.jpg" } ["send_data"]=> string(0) "" }
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      Pour ton souci de bouton pour ajouter une ligne,
      Commence par regarder dans la console javascript de ton navigateur si il n'y aurait pas une erreur ou des messages pouvant expliquer la cause du souci
      0
  20. slefevre77 Messages postés 34 Statut Membre
     
    J'ai trouvé, mais cela n'indique pas d'erreur :

    https://xxx/javascript.js
    État
    200
    OK
    VersionHTTP/2
    Transfert1,13 Ko (taille 2,36 Ko)
    Politique de référentstrict-origin-when-cross-origin

    accept-ranges
    bytes
    content-encoding
    gzip
    content-length
    860
    content-type
    application/javascript
    date
    Sun, 12 Dec 2021 20:20:35 GMT
    etag
    "96e-5d2f87dbd02fe-gzip"
    last-modified
    Sun, 12 Dec 2021 20:06:26 GMT
    server
    nginx
    vary
    Accept-Encoding
    X-Firefox-Spdy
    h2

    Accept
    • /*

    Accept-Encoding
    gzip, deflate, br
    Accept-Language
    fr,fr-FR;q=0.8,en-US;q=0.5,en;q=0.3
    Cache-Control
    max-age=0
    Connection
    keep-alive
    Cookie
    PHPSESSID=14501fe26e6fbb6ba74eb2f5795ed91a
    Host
    bluray4.domunix.fr
    If-Modified-Since
    Sun, 12 Dec 2021 20:06:26 GMT
    If-None-Match
    "96e-5d2f87dbd02fe-gzip"
    Referer
    https://xxxx/formulaire.php
    Sec-Fetch-Dest
    script
    Sec-Fetch-Mode
    no-cors
    Sec-Fetch-Site
    same-origin
    TE
    trailers
    User-Agent
    Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:95.0) Gecko/20100101 Firefox/95.0
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      Même après que tu aies. Cliqué sur le bouton ?

      Tu peux nous faire une capture écran pour le coup ça sera plus lisible
      0
  21. slefevre77 Messages postés 34 Statut Membre
     
    En changeant de navigateur, j'ai trouvé ceci à l'ouverture du formulaire :

    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      Ca on s'en fou in peu :-)
      C'est l'onglet console (JavaScript) qui m'intéresse pour l'instant
      0
  • 1
  • 2

Discussions similaires

java script error in the main process
ceciel2307 -
Thibaut -

3 réponses
smarphone écran cassė (noir): comment récupérer ses données?
camsin -
camsin -

7 réponses