Discussion :

[etoileweb]

Bonjour,
Je voudrais savoir comment faire valider ses formulaires sans recharger la page, un peu comme le formulaire d'inscription sur twitter par exemple.
Lorsque vous remplissez un champ, il est automatiquement validé et un message s'affiche pour informer si les données sont conformes ou pas. J'imagine que cela se fait via AJAX. Y a-t-il un moyen "symfonique" de réaliser cela ? Merci.

[Fused]

Créé une requête asynchrone sur le déclenchée par le click de validation du formulaire.

En javascript:
- Stop l'action pour que le formulaire ne se "submit" pas.
- Requête asynchrone en post ou tu y met les données de ton formulaire. L'URL va être celle de ton formulaire que tu peux récupérer dans le javascript.

Tu récupère tout ça normalement dans ton contrôleur "symfo-nique" comme tu dis.

Bien sur, retourne un résultat ! Tu le traite en javascript pour afficher si l'action a marché ou non. Tant qu'a faire, retourne les erreurs le cas échéant.

Un exemple vite fait avec mootools (non testé).

Code :

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

1
2
3
4
5
6
7
8
9
10
$('myForm').addEvent('submit', function(key) {
	key.stop();
	var options = {
		url : $('myForm').action,
		method : 'post',
		onSuccess: function() {
		// ici tu traite ton résultat
	};
	new Request(options).post();
});

[bricecol]

Voici un tout petit exemple, en trois parties (xhtml/JS/PHP)

Code :

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

1
2
3
4
<form id="monform" action="<?php echo url_for('@traiteMonForm')?>" method="post">
  <!-- Les champs ici avec renderRow() -->
  <p><input type="submit"/></p>
</form>

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
// avec JQuery
$('#monform').submit(function(){
  var form = $(this);
  var action = form.attr('action');
  var method = form.attr('method');
  $.ajax({
    url: action,
    method: method,
    data: form.serialize(),
    success: function(response){
      // traitement de la réponse ici
    }
  });
  return false;
});

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<?php
public function executeTraiteMonForm(sfWebRequest $request){
  $this->forward404Unless($request->isXmlHttpRequest()); // optionnel
 
  $form = new MonForm();
  // Traitements et validation du formulaire
 
  /* Pour retourner le résultat du traitement, on peut renvoyer au JS du JSON (json_encode) par exemple
  ou un simple 0/1... Tout cela avec renderText() */
}
?>

[Michel Rotta]

J'ai plus simple...

Première chose, il ne faut surtout pas désactiver la validation en php y compris l'éventuel renvois du formulaire, pour le cas où l'utilisateur n'aurait pas de JS actif sur son poste (faut bien valider) ou encore, celui qui modifierait le paquet POST avant l'envoie...

Tu as un plugin qui prend les validators et les utilises en JS pour pré-valider le formulaire, il marche avec 95% des validators, ce qui n'est déjà pas si mal.

Le plugin : sfJqueryFormValidationPlugin et tu n'as rien à retoucher.