Discussion :

[coincoin22]

Bonjour,

Je galère depuis un moment

J'ai une série de formulaires:

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
<form action="index.php" method="post" class="booster">
    <input type="hidden" name="mode" value="booster">
    <input type="hidden" name="matchid" value="1">
    <input type="hidden" name="booster" value="true">
    <input type="submit" id="booster" value="Valider" class="button">
</form>
<form action="index.php" method="post" class="booster">
    <input type="hidden" name="mode" value="booster">
    <input type="hidden" name="matchid" value="2">
    <input type="hidden" name="booster" value="false">
    <input type="submit" id="booster" value="Valider" class="button">
</form>

Puis ensuite, par jquery

Code :

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

1
2
3
4
$('.booster').on('submit', function(event) {	   								   
    [...]					
    return false;
 });

Comment modifier la valeur (value) du champ input "booster" dans le formulaire qui a été submitté.

Ensuite, je sérialise:

Code :

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

1
2
event.preventDefault();
$(this).serialize();

Pour envoyer le tout en ajax.

J'ai bien essayé ça:

Code :

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

1
2
 
$("input[name='booster']").val("test");

Mais bien entendu, ça modifie la value de tous les champs booster de tous les formulaires !!


Merci de votre aide.

coincoin22

[coincoin22]

Et:

Code :

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

1
2
3
 
var val = $(this).find("input[name='booster']").val();
alert(val);

ou

Code :

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

1
2
 
alert($(this).closest('.booster').find('input[name=booster]').val());

me renvoit 'undefined' !!!!

[danielhagnoul]

1) <input type="submit" id="booster" value="Valider" class="button">.

Un ID doit être unique !


2) $( this ).find( "input[name='booster']" ).val( "test" );.

[coincoin22]

Merci pour ta réponse.

Mais si je fais ceci en retirant l'id booster.

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
<form action="index.php" method="post" class="booster">
    <input type="hidden" name="mode" value="booster">
    <input type="hidden" name="matchid" value="1">
    <input type="hidden" name="booster" value="true">
    <input type="submit" value="Valider" class="button">
</form>
<form action="index.php" method="post" class="booster">
    <input type="hidden" name="mode" value="booster">
    <input type="hidden" name="matchid" value="2">
    <input type="hidden" name="booster" value="false">
    <input type="submit" value="Valider" class="button">
</form>

Puis,

Code :

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

1
2
3
 $('.booster').on('submit', function(event) {
    $( this ).find( "input[name='booster']" ).val();
});

Il me resort undefined.

A noter que les formulaires sont créés dynamiquement en php par une requête sql et une boucle while.

Code php :

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

1
2
3
4
5
6
7
8
9
10
11
$sql = $link->query(".....");
 
while($dnn = mysqli_fetch_assoc($sql))
			{		
                        echo '<form action="index.php" method="post" class="booster">';
			echo "<input type=\"hidden\" name=\"mode\" value=\"booster\">";
			echo "<input type=\"hidden\" name=\"matchid\" value=\"".$dnn["id"]."\">";
			echo "<input type=\"hidden\" name=\"booster\" value=\"".$dnn["booster"]."\">";
			echo '<input type="submit" value="valider" class="button">';
			echo '</form>';
}

Je pense qu'il y a peut-être un pb aussi de ce côté ???

Merci de ton aide...

[danielhagnoul]

A noter que les formulaires sont créés dynamiquement en php par une requête sql et une boucle while.

Je pense qu'il y a peut-être un pb aussi de ce côté ?

Oui, on() avec deux sélecteurs. Voir la FAQ dans ma signature.

Code JavaScript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
$( function(){ // forme abrégée de $(document).ready(function(){
 
    $( 'body' ).on( 'submit', 'form.booster', function( event ){
 
        // debug, console, touche F12
        console.log( $( this ).find( "input[name='booster']" ).val() );
 
        // transaction AJAX
 
        return false;
    });
 
});

[coincoin22]

Merci pour ces explications. Mais malheureusement ça me sort "undefined".

Voilà mon code complet (index.php):

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
<div id="pronos">
<?php
$userid=$_SESSION['userid'];
$sql = $link->query("........") or die (mysql_error());
while($dnn = mysqli_fetch_assoc($sql)){
	echo '<table width="100%">';
	echo '<tbody><tr>';
	echo '<td class="t5">';echo '<img src="images/archives.png">';echo '</td>';
	echo '<td class="t10">';echo 'AAA';echo '</td>';
	echo '<td class="t10">';echo $dnn['date2'];echo '</td>';
	echo '<td class="t5">';echo '<img src="images/flags/'.$dnn['eq1'].'.png"/>';echo '</td>';
	echo '<td class="t15">';echo $dnn["eq1"];echo '</td>';
	echo '<form action="index.php" method="post" class="validation">';
	echo "<input type=\"hidden\" name=\"mode\" value=\"validation\">";
	echo "<input type=\"hidden\" name=\"matchid\" value=\"".$dnn["id"]."\">";
	echo '<td class="t5">';echo '<select name="scoreEq1" id="seleq1">\n';for($i = 0; $i <= 9; $i++)echo '<option value='. $i .''.($i == $dnn["score1"] ? " selected" : "").'>'. $i .'</option>\n';echo '</select> ';echo '</td>';
	echo '<td class="t5">';echo '<select name="scoreEq2" id="seleq2">\n';for($j = 0; $j <= 9; $j++)echo '<option value='. $j .''.($j == $dnn["score2"] ? " selected" : "").'>'. $j .'</option>\n';echo '</select> ';echo '</td>';
	echo '<td class="t15">';echo $dnn["eq2"];echo '</td>';
	echo '<td class="t5">';echo '<img src="images/flags/'.$dnn['eq2'].'.png"/>';echo '</td>';
	echo '<td class="t10">';echo '<input type="submit" value="Valider" class="button">';echo '</td>';
	echo '</form>';
	echo '<form action="index.php" method="post" class="booster">';
	echo "<input type=\"hidden\" name=\"mode\" value=\"booster\">";
	echo "<input type=\"hidden\" name=\"matchid\" value=\"".$dnn["id"]."\">";
	echo "<input type=\"hidden\" name=\"booster\" value=\"".$dnn["booster"]."\">";
	echo '<td class="t10">';echo '<input type="submit" value="Booster ce match" class="button">';echo '</td>';
	echo '</form>';
	echo '<td class="t5">';echo 'AAA';echo '</td>';
	echo '</tbody></tr>';
	echo '</table>';
}
?>  
</div>

Puis dans un fichier externe js:

Code :

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

1
2
3
4
5
6
7
8
$( function(){ // forme abrégée de $(document).ready(function(){
    $( 'body' ).on( 'submit', 'form.booster', function( event ){
        // debug, console, touche F12
        console.log( $( this ).find( "input[name='booster']" ).val() );
        // transaction AJAX
        return false;
    });
});