Requête Ajax ne fonctionne pas.

Version imprimable

Bonjour à tous,

J'ai un formulaire que je souhaite envoyer en utilisant Ajax, cependant cela ne fonctionne pas, et je n'arrive pas à trouver le problème.

Voici mon fichier fonction.php (J'affiche le nom juste pour tester...)

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
28
29
30
31
32
33
34
35
 
 
add_action( 'wp_ajax_custom_action', 'custom_action' );
add_action( 'wp_ajax_nopriv_custom_action', 'custom_action' );
 
function custom_action() {
	if(isset($_POST['name']) && isset($_POST['email']) && isset($_POST['message']))
	{
		if(($_POST['name'] !== '') && ($_POST['email'] !== '') && ($_POST['message'] !== ''))
		{
			$name = $_POST['name'];
			$email = $_POST['email'];
			$message = $_POST['message'];
			$myemail = "vincentbaguet@live.fr";
 
			$headers  = 'MIME-Version: 1.0' . "\r\n";
			$headers .= 'Content-type: text/html; charset=utf-8' . "\r\n";
 
			$headers .= 'Reply-To: ' . $email . "\n"; // Mail de reponse
			$headers .= 'To: ' . $myemail . ' <'. $myemail . '>' . "\r\n";
			$headers .= 'From: ' . $name . ' <' . $email . '>' . "\r\n";
			$headers .= 'Delivered-to: ' . $myemail . "\n"; // Destinataire
 
			$title = 'Un nouveau message prevenant de la Fondation Zita';
			$message = '<html><body>' . $message . '</body></html>';
 
			$mail = wp_mail($myemail, $title, $message, $headers);
 
			echo $_POST['name']; 
		}
	}
 
	echo $_POST['name']; 
 
}

Voici mon fichier 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
26
27
28
29
30
31
32
33
34
35
36
37
38
 
$(document).ready(function() {
 
	$('#contact').submit(function(e){
 
		e.preventDefault();
 
		name = $(this).find("#name").val();
		email = $(this).find("#email").val();
		message = $(this).find("#message").val();
 
		if(name === '' || email === '' || message === '') {
			$("#error").empty();
			$("#error").append("Tous les champs doivent être remplis.");
			$('#error').slideDown(function() {
				setTimeout(function() {
					$('#error').slideUp(function() {});
				}, 3000);
			});
		}
		else {
 
			var submitform = $(this).serialize();
 
			$.ajax({ 
				url: '/wp-admin/admin-ajax.php',
				data: submitform,
				type: 'post',
				success: function(data) {
	          		alert(data); //should print out the name since you sent it along
				}
			});
		}
 
		return false;
 
	});
});

Cela fonctionne bien quand les champs sont vides, j'ai bien le message d'erreur, mais après ça se complique.

Mon fichier template-contact.php

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
<?php
/*
Template Name: Contact
*/
 
get_header(); ?>
 
<?php if ( have_posts() ) : ?>
 
	<?php while ( have_posts() ) : the_post(); ?>
 
		<article class="post">
 
			<header>
				<div class="title">
					<h2><a href="#"><?php single_post_title(); ?></a></h2>
				</div>
			</header>
 
			<?php the_content(); ?>
 
			<form id="contact" method="post" action="">
				<div class="row uniform">
					<div class="6u 12u$(xsmall)">
						<input type="text" name="name" id="name" placeholder="Nom" />
					</div>
					<div class="6u$ 12u$(xsmall)">
						<input type="email" name="email" id="email" placeholder="Email" />
					</div>
					<div class="12u$">
						<textarea name="message" id="message" placeholder="Message" rows="6"></textarea>
					</div>
					<div class="12u$">
						<ul class="actions">
							<li><input type="submit" value="Envoyer" /></li>
							<li><input type="reset" value="Vider le formulaire" /></li>
						</ul>
					</div>
				</div>
			</form>
 
		</article>
 
	<?php endwhile; ?>
 
<?php endif; ?>
 
<?php get_footer(); ?>

Merci de votre aide

11/07/2016, 00h29
mathieu

affichez le contenu de submitform avant l'appel AJAX
et regardez dans la console de développement si l'appel AJAX se fait bien

Merci beaucoup, je n'y avais pas pensé et cela m'a déjà permis d'avancer.
Cependant maintenant mon script php est bien pris en compte et le data ajax me retourne ceci : "Reussi0" et mon email ne part pas. J'ai essayer de simplifier mon wpmail mais cela ne marche pas non plus.
Le 0 de "Reussi0" peut-il en être la cause ? Pourquoi affiche-t'il 0 ?

Voici mon code php de fonctions.php

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
 
add_action( 'wp_ajax_custom_action', 'custom_action' );
add_action( 'wp_ajax_nopriv_custom_action', 'custom_action' );
 
function custom_action() {
	if(isset($_POST['name']) && isset($_POST['email']) && isset($_POST['message']))
	{
		if(($_POST['name'] !== '') && ($_POST['email'] !== '') && ($_POST['message'] !== ''))
		{
			$name = $_POST['name'];
			$email = $_POST['email'];
			$message = $_POST['message'];
			$myemail = "vincentbaguet@outlook.com";
 
			$headers  = 'MIME-Version: 1.0' . "\r\n";
			$headers .= 'Content-type: text/html; charset=utf-8' . "\r\n";
 
			$headers .= 'Reply-To: ' . $email . "\n"; // Mail de reponse
			$headers .= 'To: ' . $myemail . ' <'. $myemail . '>' . "\r\n";
			$headers .= 'From: ' . $name . ' <' . $email . '>' . "\r\n";
			$headers .= 'Delivered-to: ' . $myemail . "\n"; // Destinataire
 
			$title = 'Un nouveau message prevenant de la Fondation Zita';
			$message = '<html><body>' . $message . '</body></html>';
 
			wp_mail($myemail, $title, $message, $headers);
 
			echo "Reussi";
		}
		else
		{
			echo "erreur";
		}	
	}
 
	else
	{
		echo "erreur";
	}	 
 
}

Un grand merci

11/07/2016, 20h29
mathieu

le 0 de fin vient du fichier admin-ajax.php. pour ne pas l'avoir il suffit de mettre un exit(); à fin de la fonction custom_action.

pour l'e-mail, affichez le résultat de wp_mail(....
s'il vaut 0 cela veut dire par exemple que le serveur SMTP n'a pas trouvé le domaine de l'adresse e-mail d'envoi ou du destinataire

Ah voilà je comprends. Le fait que je sois en local explique cela xD

Tout roule nickel. Pour ceux qui souhaiteraient le code fonctionnel :

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
$(document).ready(function() {
 
	$('#contact').submit(function(e){
 
		e.preventDefault();
 
		name = $(this).find("#name").val();
		email = $(this).find("#email").val();
		message = $(this).find("#message").val();
 
		if(name === '' || email === '' || message === '') {
			$("#error").empty();
			$("#error").append("Tous les champs doivent être remplis.");
			$('#error').slideDown(function() {
				setTimeout(function() {
					$('#error').slideUp(function() {});
				}, 3500);
			});
		}
		else {
 
			$.ajax({ 
				dataType : "json",
				url: '../wp-admin/admin-ajax.php',
				data: { action: "custom_action", name:name, email:email, message:message },
				type: 'post',
				success: function(data) {
					if(data.clear) { 
						$("#contact")[0].reset();
						$("#success").empty();
						$("#success").append(data.error);
						$('#success').slideDown(function() {
			        		setTimeout(function() {
			            		$('#success').slideUp(function() {});
							}, 3500);
						});
					}
					else
					{
						$("#error").empty();
						$("#error").append(data.error);
						$('#error').slideDown(function() {
			        		setTimeout(function() {
			            		$('#error').slideUp(function() {});
							}, 3500);
						});
					}
				}
			});
		}
 
		return false;
 
	});

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
 
add_action( 'wp_ajax_custom_action', 'custom_action' );
add_action( 'wp_ajax_nopriv_custom_action', 'custom_action' );
 
function custom_action() {
 
	if(!filter_var($_POST['email'], FILTER_VALIDATE_EMAIL))
	{
    	echo "Votre adresse email n'est pas valide";
	}
	else
	{
		if(isset($_POST['name']) && isset($_POST['email']) && isset($_POST['message']))
		{
			if(($_POST['name'] !== '') && ($_POST['email'] !== '') && ($_POST['message'] !== ''))
			{
				$name = $_POST['name'];
				$email = $_POST['email'];
				$message = $_POST['message'];
				$myemail = "votre email";
 
				$headers  = 'MIME-Version: 1.0' . "\r\n";
				$headers .= 'Content-type: text/html; charset=utf-8' . "\r\n";
 
				$headers .= 'Reply-To: ' . $email . "\n"; // Mail de reponse
				$headers .= 'To: ' . $myemail . ' <'. $myemail . '>' . "\r\n";
				$headers .= 'From: ' . $name . ' <' . $email . '>' . "\r\n";
				$headers .= 'Delivered-to: ' . $myemail . "\n"; // Destinataire
 
				$title = 'Un nouveau message prevenant de la Fondation Zita';
				$message = '<html><body>' . $message . '</body></html>';
 
				wp_mail($myemail, $title, $message, $headers);
 
            	$result['error'] = "Votre message a bien été envoyé.";
            	$result['clear'] = true;
			}
			else
			{
				$result['error'] = "Tous les champs doivent être remplis.";	
			}	
		}
 
		else
		{
			$result['error'] = "Un problème est survenu.";
		}
	}
 
	$result = json_encode($result);
	echo $result;
 
	die();
}