Requête Ajax ne fonctionne pas.

**Vinzzzzzz** · 10/07/2016, 21h43

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 :

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
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 :

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
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 :

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
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

**mathieu** · 11/07/2016, 00h29

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

**Vinzzzzzz** · 11/07/2016, 08h31

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 :

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
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

**mathieu** · 11/07/2016, 20h29

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

**Vinzzzzzz** · 11/07/2016, 21h12

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 javascript :

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
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 :

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
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();
}

Requête Ajax ne fonctionne pas.

WordPress PHP

Vue hybride

Discussions similaires

Partager

Partager