Bonjour à tous.

Alors voilà, je souhaiterai, comme dis dans le titre, "fusionner" JS, Jquery et PHP.

Mais lors de mes tests j'ai rencontré un problème assez récurent que je n'arrive pas à fixer "proprement" (sans utiliser de méthodes farfelues)

Je m'explique:

Par exemple, j'ai cette boucle qui me liste le nom de mes joueurs:

<?php foreach( $Players as $Player ){ ?>
    	<tr>
    	        <td><?php echo htmlspecialchars( $Player['Name'] ); ?></td>
  		<td>
	    	        <form style="display: inline-block;" class="kickform" method="post" action="script/action.php">
	    			<input type="hidden" name="kick" value="<?php echo htmlspecialchars( $Player[ 'Name' ] ); ?>">
	    			<input type="text" name="raison" placeholder="Raison">
	    			<input type="submit" name="" value="Kick">
	    		</form>
	   	</td>
    	</tr>
<?php } ?>

Donc voilà, je souhaite que quand le bouton submit est pressé l'information name="kick" soit envoyée avec ajax à une autre page php.

$(".kickform").submit(function(e) {

    e.preventDefault();

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
        type: "POST",
        url: url,
        data: form.serialize(),
    });
});

Le problème étant que mon ajax envoie TOUTES les informations name à cause de la boucle alors que je voudrais qu'il envoie seulement l'information qui est affichée avec le bouton kick.

Voilà je ne sais pas si je me suis bien expliqué, j'espère que vous serez m'aidé à trouver une solution pour franchir la barrière client / server side.

Bonne soirée/journée.

-
Edité par BaguetteV1 21 janvier 2020 à 18:20:41

Salut,

tu veux juste envoyer la valeur de ton champ dont l'attribut name="kick ?

...

const kick = Array.from(this.children).find(x => x.name === 'kick');

$.ajax({
    type: "POST",
    url: url,
    data: kick.name + '=' + kick.value,
});

-
Edité par BrainError 22 janvier 2020 à 9:36:06

Salut. Tu peux essayer ceci

<?php foreach( $Players as $Player ){ ?>
    <tr>
        <td><?php echo htmlspecialchars( $Player['Name'] ); ?></td>
        <td>
            <a class = "kick-btn" href="#" data-name="<?php echo htmlspecialchars( $Player[ 'Name' ] ); ?>">KICK</a>
        </td>
    </tr><br>
<?php } ?>

$('.kick-btn').click(function(e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "script/action.php",
            data: {
                name: $(this).attr('data-name')
            },
        });
    })

-
Edité par kulturman 22 janvier 2020 à 10:28:22

ça ne marche pas.

Le problème étant que cette méthode marche comme la mienne le problème étant que l'ajax envoie a mon fichier ceci:

kick="Nom1"&kick="Nom2"&kick="Nom3"&...

Je voudrais recevoir que le "kick" (nom du joueur) correspondant à la ligne du seulement de celui de la ligne ou le bouton kick a été appuyé.

Merci

Bonjour BaguetteV1 ,

Pour moi, cela fonctionne :

https://codepen.io/Zonecss/pen/ZEYVLPM

• Quand je clique sur kicka j'ai bien ?kick=kicka&raison=raison%20a
• Quand je clique sur kickb j'ai bien ?kick=kickb&raison=raison%20b

Cela n'a pour moi pas d'impact mais enlève le br après le tr

Regarde le code généré de ta page pour voir si le code est ok

-
Edité par AliasDmc 22 janvier 2020 à 18:45:41