Discussion :

[coincoin22]

Salut à tous,

Je galère depuis plusieurs jours

- J'ai un tableau avec un formulaire par ligne pour mettre à jour des scores de matchs. Ma requête ajax est la suivante:

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
$("[id^='form']").on('submit', function() {
 var date2 = $('date2').val();
 var scoreEq1 = $('seleq1').val();
var scoreEq2 = $('seleq2').val();
 var idMatch = $('idMatch').val();
 var nomEq1 = $('nomEq1').val();
var nomEq2 = $('nomEq2').val();
 $('#loader'+idMatch).show();
$.ajax({
	url: "get_admin.php", 
	type: $(this).attr('method'),
	data: $(this).serialize(),						    
	success: function(results) {
		$("#valid"+results).css({"background-color":"green"});
         }
});
return false;
});

Tout fonctionne parfaitement.

- J'ai un autre formulaire qui permet d'ajouter une ligne dans mon tableau avec le formulaire qui va bien:

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
$('#createform').on('submit', function() {
var createdate = $('createdate').val();
var createEq1 = $('createEq1').val();
var createEq2 = $('createEq2').val();
var createevent = $('createevent').val();
$.ajax({
	url: "admin_create.php", // le nom du fichier indiqué dans le formulaire
	type: $(this).attr('method'), // la méthode indiquée dans le formulaire (get ou post)
	data: $(this).serialize(), // je sérialise les données (voir plus loin), ici les $_POST
	async: false,
	success: function(results) {							
		$('#matchtab > tbody').append(results);
	}
 });
 return false;
});

La ligne est bien ajouter dans mon tableau. Le formulaire à même allure que les autres formulaires de mon tableau:

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
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
<?php
$sql = mysql_query("
	SELECT
	matchs.id as id, matchs.eq1 as eq1, matchs.eq2 as eq2, matchs.score_eq1 as score1, matchs.score_eq2 as score2, matchs.date AS date2
	FROM `matchs`
	WHERE score_eq1=-1
	ORDER BY matchs.date
") or die (mysql_error());
if (mysql_num_rows($sql) > 0) {
	echo '<table class="tinytable" id="matchtab">';
?>
<thead>
<tr style="color:green;">
	<th><h3>Date</h3></th>
	<th><h3>Equipe 1</h3></th>
	<th><h3>Score Eq1</h3></th>
	<th><h3>Score Eq2</h3></th>
	<th><h3>Equipe 2</h3></th>
	<th><h3></h3></th>
</tr>
</thead>
<tbody>
<?php
	while($data = mysql_fetch_assoc($sql)) {
		// On ouvre le formulaire
		echo '<tr>';
		echo '<form action="admin.php#match'.$data["id"].'" method="post" id="form'.$data["id"].'">';
		// On définit l'input caché qui nous permettra de valider le formulaire
		echo "<input type=\"hidden\" name=\"validation\" value=\"ok\">";
		// On définit l'input caché qui contiendra l'id du match
		echo "<input type=\"hidden\" name=\"idMatch\" value=\"".$data["id"]."\">";
		// On récupère en POST le nom de l'equipe 1
		echo "<input type=\"hidden\" name=\"nomEq1\" value=\"".$data["eq1"]."\">";
		// On récupère en POST le nom de l'équipe 2
		echo "<input type=\"hidden\" name=\"nomEq2\" value=\"".$data["eq2"]."\">";
		echo '<div style="color:green;display:block;margin-left:10px;" id="update'.$data["id"].'"></div>';
?>
<?php
		echo '<td class="loss" style="padding-left:0%">';
 		echo "<input name=\"date2\" value=\"".$data["date2"]."\">";
?>
		</td>
<?php
		echo '<td style="padding-left:0%">';
		echo $data['eq1']."\n";
?>
		</td><td style="padding-left:0%"><?php
		echo '<select name="scoreEq1" id="seleq1">\n';
		for($i = -1; $i <= 9; $i++)
			echo '<option value='. $i .''.($i == $data["score1"] ? " selected" : "").'>'. $i .'</option>\n';
		echo '</select> ';?></td>
<?php
		// On affiche la sélection pour l'équipe 2
?>
		<td style="padding-left:0%"><?php
		echo '<select name="scoreEq2" id="seleq2">\n';
		for($j = -1; $j <= 9; $j++)
			echo '<option value='. $j .''.($j == $data["score2"] ? " selected" : "").'>'. $j .'</option>\n';
		echo '</select> ';?></td>
<?php
		// On affiche l'équipe 2
		echo '<td style="padding-left:0%">';
		echo $data['eq2']."\n";
?>
<?php
		echo '</td><td style="padding-left:0%"><center><input style="font-size:10px;" type="submit" value="VALIDER" id="valid'.$data["id"].'" class="boost_btn"></center></td>';
		echo '</form></tr>';
?>

Mais le nouveau formulaire inséré, impossible de le soumettre, rien ne se passe !!!
J'ai du raté quelquechose !!

Aidez-moi s'il vous plaît les amis ;-)

A+
coincoin22

[Sergejack]

Il faut que vous lier l'evenement "submit" à votre ligne fraichement rajoutée car à prioris vous ne faites liaison qu'au "démarrage" de votre page à propos des formulaires déjà existants.

[coincoin22]

Salut !

Merci de ton aide !

J'ai fait un truc comme ça :

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
function RunAfterAjax() {
	alert('test');
	//$('.tinytable').dataTable();
 
	$("[id^='loader']").hide();
	//$('#loader<?php echo $data["id"];?>').hide();
	// lorsque je soumets le formulaire
	$("[id^='form']").on('submit', function() {							    
 
		//alert('test');
		//$('#loader<?php echo $data["id"];?>').show();
		var date2 = $('date2').val();
		var scoreEq1 = $('seleq1').val();
		var scoreEq2 = $('seleq2').val();
		var idMatch = $('idMatch').val();
		var nomEq1 = $('nomEq1').val();
		var nomEq2 = $('nomEq2').val();
		$('#loader'+idMatch).show();
 
		$.ajax({
			url: "get_admin.php", // le nom du fichier indiqué dans le formulaire
			type: $(this).attr('method'), // la méthode indiquée dans le formulaire (get ou post)
			data: $(this).serialize(),						    
			success: function(results) {
 
				$("#valid"+results).css({"background-color":"green"});
 
			}
		 });
 
		return false;
	});								
 
};
 
RunAfterAjax();

Puis

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
$( "#createdate" ).datetimepicker({
	timeFormat: 'HH:mm:ss',
	stepHour: 1,
	stepMinute: 5,
	showSecond: false
});
 
//$('#loader<?php echo $data["id"];?>').hide();
// lorsque je soumets le formulaire
$('#createform').on('submit', function() {
	//$('#loader<?php echo $data["id"];?>').show();
	var createdate = $('createdate').val();
	var createEq1 = $('createEq1').val();
	var createEq2 = $('createEq2').val();
	var createevent = $('createevent').val();
 
 
	$.ajax({
		url: "admin_create.php", // le nom du fichier indiqué dans le formulaire
		type: $(this).attr('method'), // la méthode indiquée dans le formulaire (get ou post)
		data: $(this).serialize(), // je sérialise les données (voir plus loin), ici les $_POST
		success: function(results) {
			$('#matchtab > tbody').append(results);
			RunAfterAjax();	
		}
	});
 
	return false;
});

Mais rien n'y fait !!! Le submit ne part pas ! Je suis désespéré !!!

Merci encore...

A+
Coincoin22

[Bovino]

Si j'en crois ton code, le formulaire renvoyé est inséré à un endroit du DOM où il n'a pas le droit d'être, il n'est donc tout simplement pas pris en compte.

Un formulaire doit soit englober une table, soit se trouver dans un unique <td>. Toute autre solution est incorrecte.

[coincoin22]

Merci encore !

Mais là je suis perdu... Le formulaire retourné par ajax a exactement la même structure que tous les autres formulaires déjà présents.
Je ne fais que rajouter une ligne (tr) à ma table.

Je ne comprends pas comment je dois faire ?

Merci d'avance...

A+
Coincoin22

[coincoin22]

Ok ça a l'air d'être ce que tu m'as dit... Reste maintenant à mettre en forme ;-)

Je te tiens au courant !

Merci !

[coincoin22]

Je n'arrive pas à mettre en forme !!! Si je sors le form du tr, tout se retrouve dans la même case !

Code :

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

1
2
echo '<form action="admin.php#match'.$max.'" method="post" id="form'.$max.'">';
					echo '<tr style="color:red;font-weight:bold;">';

Et si je le mets dans un tr, il ne fonctionne plus !