Ajouter des lignes dans un tableau dynamiquement à l'aide d'un bouton via Ajax

**madinadiouf** · 26/11/2019, 11h07

Bonjour,
Je veux générer une ligne supplémentaire dans un tableau html des que je clique sur un bouton.
voici le

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
11
12
<body>
<input type="button" id="ajout_agent_miss" value="Ajouter les agents" /></div>
<center><div id="ligne_table_agent"><table>
<tr>
<th>Nom</th>
<th>Prenom</th>
<th>Situation famille</th>
<th>Grade</th>
<th>Fonction</th>
<th>Direction</th>
</tr>
</div>

Voici le code Javascript Ajax qui contacte le fichier "affiche_liste_agents.php" pour générer une ligne supplémentaire sur le tableau déjà défini sur le code HTML précédent.

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
$( function(){ // forme abrégée de $(document).ready(function(){
 
 
	$('#ajout_agent_miss').click(function( event ) {
 
 
  // Stop form from submitting normally
      $.post(
            'affiche_liste_agents.php', // Un script PHP que l'on va créer juste après
 
            function(data){
 
              document.getElementById('ligne_table_agent').innerHTML += data;
 
            },
 
            'text'
         );
 
    }
 
 
 
		);

Voici ce que je fait dans affiche_liste_agents.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
<?php
$htm0_jrnl='<tr>
<td> <input type="text" size="18" </td>
<td> <input type="text" size="18"</td>
<td>  <input type="text" size="18"</td>
<td>  <input type="text" size="18"</td>
<td><input type="text" size="18"</td>
<td><input type="text" size="18"</td>
</tr>
</table>';
 
echo $htm0_jrnl;  
 
?>

Mais ça marche pas.

Quelle est la solution ?

**SpaceFrog** · 26/11/2019, 11h36

Première chose

Mais ça marche pas.

est une description un peu courte du problème ..
Quel sont les symptomes précis ?
Que se passe-t-il ?
Tu vois l'envoi et la réception de ton ajax en console ?
TU as un retour, que donne l'affichage ?

Ensuite une ligne c'est juste une balise <tr/>, tu rajoutes un balise de fermeture de </table> , normale que ça foute la grouille ...

**madinadiouf** · 26/11/2019, 13h27

Bonjour,

Merci je suis passe par une fonction Javascript avec les fonctions insertRow() et insertCell().
merci

Ajouter des lignes dans un tableau dynamiquement à l'aide d'un bouton via Ajax

jQuery

Vue hybride

Discussions similaires

Partager

Partager