Valider individuellement plusieurs formulaires

**Lekno** · 14/05/2013, 15h51

Bonjour à tous, je souhaiterai dans une page qui comporte plusieurs formulaires les traiter 1 à 1 sans recharger ma page.

Je pensais donc passer par Jquery, j'ai écumé pas mal d'exemple et de tuto mais je n'en trouve aucun qui correspond à mon besoin et je ne vois pas comment faire.

Mes formulaires sont généré via une boucle PHP, chacun à son propre identifiant

Code :

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

<form name="formulaire_'.$i.'" action="traitement_bdd.php" method="post">

Si vous pouvez m'indiquer une piste ou une ebauche de code je vous en remercie

**SpaceFrog** · 14/05/2013, 16h02

oui avec $.ajax, $.post ou $.get de JQuery ...

**NoSmoking** · 14/05/2013, 21h08

Bonjour,

Je pensais donc passer par Jquery...

je parlerais plutôt d'utiliser la technique Ajax, jQuery mettant à disposition des méthodes.

Pour une première approche

Comprendre les mécanismes d'AJAX

**Lekno** · 15/05/2013, 11h29

J'ai bien suivis vos réponses, j'ai tenté d'adapter un code trouvé dans un billet sur le sujet, mais ma page se recharge tout de même à l'execution, sauriez vous m'indiquer une poste pour mon erreur ?

Merci par avance pour votre aide

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
$(document).ready(function() {     
// lorsque je soumets le formulaire     
$('#formulaire_1').on('submit', function() {           
// je récupère les valeurs         
var pseudo = $('#nserie1').val();         
var mail = $('#date1').val();           
// je vérifie une première fois pour ne pas lancer la requête HTTP         
// si je sais que mon PHP renverra une erreur         
if(pseudo == '' || mail == '') {             
alert('Les champs doivent êtres remplis');        
 } else {            
 // appel Ajax             
 $.ajax({                 
 url: $(this).attr('traitement_bdd.php'), // le nom du fichier indiqué dans le formulaire                
 type: $(this).attr('post'), // 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(html) { // je récupère la réponse du fichier PHP                    
 alert(html); // j'affiche cette réponse                 
 }    
 });         
 }         
 return false; // j'empêche le navigateur de soumettre lui-même le formulaire     });

Code html :

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

1
2
3
<form name="formulaire_'.$i.'" action="traitement_bdd.php" method="post">  
SN[]=><input type="text" id="nserie1" name="nserie1" value="SN67891"></input><BR />
DATE[]=><input type="text" id="date1" name="date1" value="14/05/2013"></input><BR />

Code php :

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

1
2
3
4
5
6
7
8
9
if(isset($_POST['nserie1']) && isset($_POST['date1'])) {
     if(($_POST['nserie1'] != '') && ($_POST['date1'] != '')) {
	 $reponse = 'ok';     } 
	 else {         $reponse = 'Les champs sont vides';     
	 } } 
	 else {     
	 $reponse = 'Tous les champs ne sont pas parvenus'; 
	 }  
	 echo json_encode($reponse);

**Bovino** · 15/05/2013, 11h46

Code :

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

$('#formulaire_1')

Ton formulaire n'ayant pas d'id, il y a peu de chances que ce code soit exécuté un jour...

**Lekno** · 15/05/2013, 12h16

Je ne comprend pas bien ta réponse, mon formulaire à un "name" et cela dit je viens de tenter avec un "id" j'ai le même soucis, rechargement de la page

Code html :

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

<form name="formulaire_1" id="formulaire_1" action="traitement_bdd.php" method="post">

**Lekno** · 15/05/2013, 17h47

Je reviens vers vous, j'ai largement modifié mon idée de départ pour arriver à ceci

Je traite l'ensemble de mes formulaires via le $("form"), mon soucis est que je peux avoir 10 ou 15 formulaires/page à traiter individuellement

Lors du traitement, j'obtien un Undefined variable pour l'ensemble de mes variables de formulaire. La fonction serialize() devrait pourtant me récupérer mes valeurs de formulaire et helas ce n'est pas le cas.

Merci pour votre coup de pouce par avance

Code js :

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

1
2
3
4
5
6
7
8
9
10
11
 
<script>
$(document).ready(function() {     
		$("form").submit(function () {
            $.post("traitement_bdd.php",$("form").serialize(),function(texte){
                $("div#status").append(texte);
            });
            return false; // ne change pas de page
    });   
 }); 
</script>