Traitement formulaire Zend avec Ajax

Version imprimable

Bonjour, j'ai créé un formulaire avec Zend et je souhaite le traiter avec l'aide de l'Ajax, pour ce faire, j'ai ajouté:

Code:

$this->setAttrib('onSubmit', 'return maFonction();');

A mon formulaire où je fais un alert() dans la fonction qui est appelée lors de l'appuie sur le submit mais après ma page charge automatiquement celle de l'index sans que je puisse faire un traitement, comment puis-je faire en sorte de pouvoir faire mon traitement?

Voici la fonction javascript appelée, je l'ai testé avec un alert() au moment de l'appel, elle fonctionne:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$.ajax(
	{
	   url: 'index/traitement-form',
	   type: 'GET',
	   context: document.corps,
	   data: 
	   {
		"format" : "html",
		"nom" : document.getElementById('nom'),
		"mail" : document.getElementById('mail'),
		"objet" : document.getElementById('objet'),
		"message" : document.getElementById('message')
	   },
	   error: errorAjax,
	   dataType: "html",
	   success: function(data)
	   {
			alert('traitement fait!');
	   }
	});

Voici mon controlleur (par ailleurs, que puis-je mettre dans mon if pour vérifier si mon formulaire est valide?):

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$nom = $this->_getParam('nom');
    	$mail = $this->_getParam('mail');
    	$objet = $this->_getParam('objet');
    	$message = $this->_getParam('message');
 
    	$form = new ContactForm();
    	$form->getElement('nom')->setValue($nom);
    	$form->getElement('mail')->setValue($mail);
    	$form->getElement('objet')->setValue($objet);
    	$form->getElement('message')->setValue($message);
 
    	// s'il n'est pas valide
    	if()
    	{
    		$this->view->traitement = true;
    		$this->view->form = $form->populate($formData);
    	}else 
    	{
    		$this->view->traitement = false;
    	}

Ma vue:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php 
if($this->traitement)
{
	echo "<script type='text/javascript'>alert('Requ\352te correctement ex\351cut\351e.');</script>";
}else 
{
	echo "<fieldset class='contact'>
		<legend>Contact</legend>
		Vous avez une question, une suggestion ou autre chose &agrave; me soummettre?<br/><br/>
		Dans ce cas, compl&eacute;tez ce formulaire ou <br/>
		contactez-moi directement &agrave; mon adresse mail: <a href='mailto:aurelien.laval@gmail.com' class='adresseMail'>aurelien.laval@gmail.com</a>" 
		. $this->form . "
		<span class='champs_required'>Les champs comportants un * sont obligatoires.</span>
	  </fieldset>";
}
?>

Merci de votre aide.

18/10/2011, 19h13
5h4rk

Il te faut :

Code:

return false;

dans ta fonction ce qui évitera de poursuivre.

Pas besoin de faire return quand tu déclare onsubmit, le nom de ta fonction suffit

Comme cela?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
$.ajax(
	{
	   url: 'index/traitement-form',
	   type: 'GET',
	   context: document.corps,
	   data: 
	   {
		"format" : "html",
		"nom" : document.getElementById('nom'),
		"mail" : document.getElementById('mail'),
		"objet" : document.getElementById('objet'),
		"message" : document.getElementById('message')
	   },
	   error: errorAjax,
	   dataType: "html",
	   success: function(data)
	   {
			alert('traitement fait!');
	   }
	});
	return false;

Et dans mon controlleur, dans mon if'), qu'est-ce que je peux lui mettre comme condition pour vérifier qu'il est valide svp?

18/10/2011, 20h34
5h4rk

Ça c est a toi de voir en fonction de ce que tu veux faire

Quand j'appuie, ca continue de me rediriger vers la page index automatiquement alors que j'ai bien mis "return false;" à ma fonction javascript, comment ça se fait? :cry:

fonction javascript:

Code:

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
 
function traitementFormulaireContact()
{
	$.ajax(
	{
	   url: 'index/traitement-form',
	   type: 'POST',
	   context: document.corps,
	   data: 
	   {
		"format" : "html",
		"nom" : document.getElementById('nom'),
		"mail" : document.getElementById('mail'),
		"objet" : document.getElementById('objet'),
		"message" : document.getElementById('message')
	   },
	   error: errorAjax,
	   dataType: "html",
	   success: function(data)
	   {
			alert('traitement fait!');
	   }
	});
	return false;
}

controlleur

Code:

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
 
public function traitementFormAction()
    {
 
    	$this->_helper->layout->disableLayout();
    	$formData = $this->getRequest()->getPost();
    	// s'il n'est pas valide
    	if(!$form->isValid($formData))
    	{
    		$nom = $this->_getParam('nom');
    		$mail = $this->_getParam('mail');
    		$objet = $this->_getParam('objet');
    		$message = $this->_getParam('message');
 
    		$form = new ContactForm();
    		$form->getElement('nom')->setValue($nom);
    		$form->getElement('mail')->setValue($mail);
    		$form->getElement('objet')->setValue($objet);
    		$form->getElement('message')->setValue($message);
 
    		$this->view->traitement = true;
    		$this->view->form = $form->populate($formData);
    	}else 
    	{
    		$this->view->traitement = false;
    	}
    }