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

Résolu
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention   -  
jordane45 Messages postés 38486 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
A voir également:

29 réponses

  • 1
  • 2
Réponse 1 / 29
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 2 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
Faut enlever 
form.onsubmit = function (){return false;}
0
Réponse 3 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 4 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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

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

Posez votre question
Réponse 5 / 29
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 6 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
Réponse 7 / 29
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 8 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 9 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
Réponse 10 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
Je pense qu'il manque quelque chose pour récolter et envoyer les données.

Quelqu'un aurait une idée ?
0
Réponse 11 / 29
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 12 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
Réponse 13 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
Réponse 14 / 29
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 15 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
Réponse 16 / 29
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 17 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
Désolé pour ma réponse tardive,

C'est toujours OK, sans le javascript, je teste avec maintenant.
0
Réponse 18 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 19 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
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
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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
Réponse 20 / 29
slefevre77 Messages postés 33 Date d'inscription   Statut Membre Dernière intervention  
 
En changeant de navigateur, j'ai trouvé ceci à l'ouverture du formulaire :

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

Discussions similaires

Colis shein terminal fret
Lele -
bazfile -

1 réponse
Je n'arrive plus à récuperer mon compte Outlook
gnulinux_ -
laure -

4 réponses