Discussion :

[Bovino]

[HS]
Ayant souvent le même réflexe, je me permets...

qui vient des militaires

en fait non. Certes, cette expression est largement reprise dans le milieu militaire mais elle vient du monde de la musique : lorsqu'un musicien est en retard (ou en avance) et donc qu'il a raté un temps, l'habitude était de se signaler avec ce au temps pour moi.
[/HS]

[Sventovit]

Oui, je l’ai essayé

Code :

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

1
2
3
4
5
6
7
8
 
<?php
 
if ( ! empty($_POST['spambot'])) {
    // non-humain
}
// Define some constants
…

et ça ne bloque rien.
Que faudrait-ajouter entre les croches ?

[Sventovit]

Ah ! excellent Didier.

J’ai effectivement toujours cru que l’origine était militaire.
Mais c’est vrai que les militaires et la musique, ils ne font que la suivre.
Merci.

[Invité]

[EDIT]Auto-censure : C'était pour dire... rien du tout...

[rawsrc]

Que faudrait-ajouter entre les croches ?

Réponse au post 13, mais bon...
Tu y mets le traitement que t'as prévu pour contrer les robots.

Enfin, tu le fais quand t'as 30 secondes, une fois que les retrouvailles avec ton ami de 30 ans seront terminées, hein Jérôme alias le frère caché de maître Capello

[Invité]

[EDIT]Auto-censure : C'était pour dire... rien du tout...

[rawsrc]

Bon je voudrai pas dire mais je vais finir par parker les hors-sujets, histoire de conserver un sens plus "technique" à la discussion.

[Sventovit]

Réponse au post 13, mais bon...
Enfin, tu le fais quand t'as 30 secondes, une fois que les retrouvailles avec ton ami de 30 ans seront terminées, hein Jérôme alias le frère caché de maître Capello

La digression c’est ma faute. Désolé.

Réponse au post 13, mais bon...
Tu y mets le traitement que t'as prévu pour contrer les robots.

Oui, c’est aussi ce que j’ai fait avec

Code :

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

1
2
 
echo "<p>Merci pour votre message ! Je vous réponds dès que possible.</p>";

mais, ça ne marche pas.
Peut-être qu’Ajax empêche cette instruction ?

[Invité]

Vu qu'on ne peut plus rigoler...

Tu nous a montré le formulaire et le fichier de traitement PHP, mais...
où est ton script JavaScript/jQuery, qui envoie les données à la page de traitement ?
Peut-être n'envoies-tu pas correctement toutes les données ?

Ca devrait ressembler à ça :

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
	// ------------------------------------------------------------------ 
	$(document).ready(function(){ 
		$('#contactForm').on('submit' function() {
			// ------------------------ 
			// récupération des données
			var this_url			= $(this).attr('action'); 		// le nom du fichier indiqué dans le formulaire
			var this_type			= $(this).attr('method'); 		// la méthode (get ou post) indiquée dans le formulaire
			var this_data			= $(this).serialize(); 			// on sérialise les données, pour les tansmettre via ajax
			// ------------------------ 
			// appel Ajax
			var texthtml			= '';
			$.ajax({
				url: 				this_url,
				type: 				this_type,
				data: 				this_data,
				dataType: 			'html',
				cache: 				false,
				success: function(texthtml) {
					$('#div_retour_ajax').html(texthtml); // on remplit le div de retour
					return false; 	// arrêt de la propagation de l'évènement dans le DOM
				}
			});
			return false; // on empêche le navigateur de soumettre lui-même le formulaire
			// ------------------------ 
		});
	});
	// ------------------------------------------------------------------

C'est sûr, c'est plus "technique", mais nettement moins drôle...
... bien que tout aussi éducatif...

[Sventovit]

A priori les données sont bien transmises quand je ne mets pas la barrière ant-spam.
C’est lui qui s’en occupe :

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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
 
<script type="text/javascript">
 
var messageDelay = 2000;  // How long to display status messages (in milliseconds)
 
// Init the form once the document is ready
$( init );
 
 
// Initialize the form
 
function init() {
 
  // Hide the form initially.
  // Make submitForm() the form's submit handler.
  // Position the form so it sits in the centre of the browser window.
  $('#contactForm').hide().submit( submitForm ).addClass( 'positioned' );
 
  // When the "Send us an email" link is clicked:
  // 1. Fade the content out
  // 2. Display the form
  // 3. Move focus to the first field
  // 4. Prevent the link being followed
 
  $('a[href="#contactForm"]').click( function() {
    $('#content').fadeTo( 'slow', .2 );
    $('#contactForm').fadeIn( 'slow', function() {
      $('#senderName').focus();
    } )
 
    return false;
  } );
 
  // When the "Cancel" button is clicked, close the form
  $('#cancel').click( function() { 
    $('#contactForm').fadeOut();
    $('#content').fadeTo( 'slow', 1 );
  } );  
 
  // When the "Escape" key is pressed, close the form
  $('#contactForm').keydown( function( event ) {
    if ( event.which == 27 ) {
      $('#contactForm').fadeOut();
      $('#content').fadeTo( 'slow', 1 );
    }
  } );
 
}
 
 
// Submit the form via Ajax
 
function submitForm() {
  var contactForm = $(this);
 
  // Are all the fields filled in?
 
  if ( !$('#senderName').val() || !$('#senderEmail').val() || !$('#message').val() ) {
 
    // No; display a warning message and return to the form
    $('#incompleteMessage').fadeIn().delay(messageDelay).fadeOut();
    contactForm.fadeOut().delay(messageDelay).fadeIn();
 
  } else {
 
    // Yes; submit the form to the PHP script via Ajax
 
    $('#sendingMessage').fadeIn();
    contactForm.fadeOut();
 
    $.ajax( {
      url: contactForm.attr( 'action' ) + "?ajax=true",
      type: contactForm.attr( 'method' ),
      data: contactForm.serialize(),
      success: submitFinished
    } );
  }
 
  // Prevent the default form submission occurring
  return false;
}
 
 
// Handle the Ajax response
 
function submitFinished( response ) {
  response = $.trim( response );
  $('#sendingMessage').fadeOut();
 
  if ( response == "success" ) {
 
    // Form submitted successfully:
    // 1. Display the success message
    // 2. Clear the form fields
    // 3. Fade the content back in
 
    $('#successMessage').fadeIn().delay(messageDelay).fadeOut();
    $('#senderName').val( "" );
    $('#senderEmail').val( "" );
    $('#message').val( "" );
 
    $('#content').delay(messageDelay+500).fadeTo( 'slow', 1 );
 
  } else {
 
    // Form submission failed: Display the failure message,
    // then redisplay the form
    $('#failureMessage').fadeIn().delay(messageDelay).fadeOut();
    $('#contactForm').delay(messageDelay+500).fadeIn();
  }
}
 
</script>

Comme tu peux le voir il y a d’autres fonctionnalités que mon filleul/poulain ne juge pas nécessaire. C’est après
// Submit the form via Ajax
que le traitement s’effectue.

EDIT : ah oui ça semble être un exemple pertinent, mais, n’étant pas codeur (je ne sais que baliser du HTML et manier des CSS) je ne saurai le mettre en œuvre.

[Invité]

Code :

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

1
2
3
4
5
6
    $.ajax( {
      url: contactForm.attr( 'action' ) + "?ajax=true",
      type: contactForm.attr( 'method' ),
      data: contactForm.serialize(),
      success: submitFinished
    } );

OK, Ajax semble hors de cause. Tout semble bien transmis.

Il reste le fichier de traitement.
Afin de vérifier par où "passe le traitement (et si les variables sont bonnes) :
- mets après chaque if(...) des echo 'jusqu\'ici, ca va...'; echo 'ici, aussi...';
- fais aussi des echo ... des variables transmises

[EDIT] Petite explication du fonctionnement ?

Code :

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

<form id='contactForm' action='processForm.php' method='post'>

url: contactForm.attr( 'action' ) + "?ajax=true",

l''action' est ici processForm.php
L'URL est donc ici : processForm.php?ajax=true
(on transmet en plus en GET une variable "ajax" qui vaut "true")

type: contactForm.attr( 'method' ),

la 'method' est ici POST

data: contactForm.serialize(),

serialize() les données à transmettre (ca va ressembler à : param1=data1&param2=data2&param3=data3&param4=data4&param5=data5 )

[Sventovit]

Fait, mais où passe l’écho ? Je n’en sais rien.
C’est l’alerte JS qui se déclenche disant qu’il y a eu un problème à l’envoi.
C’est tout.

EDIT : j’ai lu ton post modifié.
Merci pour l’explication de code.
C’est instructif ; surtout pour serialize qui s’avère être un élément clé du processus. Ça je ne l’avais pas vu.
C’est vrai j’essaie de ne pas me contenter de copier/coller sans comprendre ce que je fais. Mais là je n’ai pas les bases (ou le cerveau ad hoc) pour bien appréhender le traitement.

[Invité]

Essaie comme ca :

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
<?php
if ( isset($_GET["ajax"]) && $_GET["ajax"] === true) { // 1er test : true si le formulaire a bien été posté
	$success = true; // OK
} else {
	$success = false; // inutile de continuer
}
 
if(!empty($_POST['spambot'])){ // 2eme test : robots ?
	// PAS vide => robots !!
	$success = false; // inutile de continuer
}
 
// true ? on peut continuer le traitement
if($success === true){
 
 
	// Define some constants
	define( "RECIPIENT_NAME", "Clément" );
	define( "RECIPIENT_EMAIL", "clement@domaine.fr" );
	define( "EMAIL_SUBJECT", "Un message en provenance du site" );
 
	// Read the form values
	$senderName = isset( $_POST['senderName'] ) ? preg_replace( "/[^\.\-\' a-zA-Z0-9]/", "", $_POST['senderName'] ) : "";
	$senderEmail = isset( $_POST['senderEmail'] ) ? preg_replace( "/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['senderEmail'] ) : "";
	$message = isset( $_POST['message'] ) ? preg_replace( "/(From:|To:|BCC:|CC:|Subject:|Content-Type:)/", "", $_POST['message'] ) : "";
 
	// If all values exist, send the email
	if ( !empty($senderName) && !empty($senderEmail) && !empty($message) ) {
		$recipient = RECIPIENT_NAME . " <" . RECIPIENT_EMAIL . ">";
		$headers = "From: " . $senderName . " <" . $senderEmail . ">";
		$success = mail( $recipient, EMAIL_SUBJECT, $message, $headers );
	} else {
		$success = false;
	}
}
 
// Return an appropriate response to the browser
  echo $success ? "success" : "error";
?>

[Sventovit]

Mon pauvre ! Tu te donnes du mal ! Et ça ne produit toujours rien.
Je n’ai toujours pas d’alerte d’erreur sinon le même message. Infernal.

[Invité]

En fait, le traitement ne renvoie que "success" ou "error", qui n'est ensuite traiter qu'en JavaScript.
Or, j'essaie de t'aider SANS toucher au fichier JavaScript...

On devrait pouvoir vérifier les données en affichant des alert(...) JavaScript :
Mettre au début du fichier :

Code :

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

1
2
3
4
	echo '<script>alert("spambot = '.htmlspecialchars($_POST['spambot']).'");</script>';
	echo '<script>alert("senderName = '.htmlspecialchars($_POST['senderName']).'");</script>';
	echo '<script>alert("senderEmail = '.htmlspecialchars($_POST['senderEmail']).'");</script>';
	echo '<script>alert("message = '.htmlspecialchars($_POST['message']).'");</script>';

Et on peut mettre à d'autres endroits du code :

Code :

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

	echo '<script>alert("OK ICI !");</script>';

...

[Sventovit]

Et les alertes (qui fonctionnent bien sûr) ne se déclenchent pas !
C’est jQuery qui est derrière. Peut-être les bloque t-il ?

[Invité]

Avec Ajax, le fichier de traitement fonctionne "en sous-marin" ("en dehors" de la page en cours).

Le PLUS SIMPLE (?) est de traiter EN DIRECT le temps des tests (= sans passer par Ajax).
Comme les actions Ajax se basent sur l'ID du form, il suffit de remplacer :

Code :

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

<form id='contactForm' action='processForm.php' method='post'>

par :

Code :

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

<form id='tralala' action='processForm.php?ajax=true' method='post'>

Et là, les echo ... ou alert(...) s'afficheront.

[rawsrc]

Bon y a quand même un gros souci dans la logique : tu définis l'attribut action="processForm.php" de ton formulaire et tu attends un traitement ajax...
Pour que cela reste de l'ajax (donc du côté navigateur) il faut pointer sur une fonction javascript qui va se charger de l'appel ajax et du traitement des retours. En l'état, ça me parait difficile.

Voici le code du formulaire corrigé :

Code html :

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
<form id="contactForm" onsubmit="submitForm(); return false;" method="post">
    <h2>Pour m'envoyer un message...</h2>
    <ul>
        <li>
            <label for="senderName">Votre nom</label>
            <input type="text" name="senderName" id="senderName" placeholder="Ainsi que votre prénom" required="required" maxlength="40" />
        </li>
        <li>
            <label for="senderEmail">Courriel</label>
            <input type="email" name="senderEmail" id="senderEmail" placeholder="Pour que je puisse vous répondre" required="required" maxlength="50" />
        </li>
        <li>
            <label for="message" style="padding-top: .5em;">Votre message</label>
            <textarea name="message" id="message" placeholder="Sans balise HTML ni code." required="required" cols="80" rows="10" maxlength="10000"></textarea>
        </li>
        <input type="text" name="spambot" value="" />
    </ul>
    <div id="formButtons">
        <input type="submit" id="sendMessage" name="sendMessage" value="Envoyer" />
        <input type="button" id="cancel" name="cancel" value="Annuler" />
    </div>
</form>
<div id="sendingMessage" class="statusMessage"><p>Le message est en partance. Merci de patienter...</p></div>
<div id="successMessage" class="statusMessage"><p>Merci pour votre message ! Je vous réponds dès que possible.</p></div>
<div id="failureMessage" class="statusMessage"><p>Il y a eu un problème à l'envoi de votre message. Merci de réessayer.</p></div>
<div id="incompleteMessage" class="statusMessage"><p>Merci de remplir tous les champs avant d’envoyer votre message.</p></div>

Ensuite tu remplaces ton js submitForm et submitFinished par ceci :

Code js :

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
function submitForm() {
    var messageDelay = 2000;
    var contactForm = $('#contactForm');
    if ( !$('#senderName').val() || !$('#senderEmail').val() || !$('#message').val() ) {
        // No; display a warning message and return to the form
        $('#incompleteMessage').fadeIn().delay(messageDelay).fadeOut();
        contactForm.fadeOut().delay(messageDelay).fadeIn();
        return false;
    }
 
    $('#sendingMessage').fadeIn();
    contactForm.fadeOut();
 
    $.ajax({
        type: 'POST',
        url: 'processForm.php',
        data: $('#contactForm').serialize(),
        dataType: 'json',
        error: function(response) { alert('Error during call'); },
        success: function(response) {
            if(response.status == "success") {
                $('#successMessage').fadeIn().delay(messageDelay).fadeOut();
                $('#senderName').val("");
                $('#senderEmail').val("");
                $('#message').val("");             
                $('#content').delay(messageDelay+500).fadeTo('slow', 1);
            }
            else {
                $('#failureMessage').fadeIn().delay(messageDelay).fadeOut();
                contactForm.delay(messageDelay+500).fadeIn();
            }
        }
    });
}

Il faut bien comprendre qu'une erreur Ajax est différente d'une erreur de traitement à cause d'une donnée invalide.
D'un côté tu as une erreur liée par exemple à la connexion, au serveur et de l'autre tu reçois une réponse valide mais qui contient une erreur. C'est différent.


Enfin voici le code PHP qui va bien :

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
$response = "{ status: 'error' }";
$mail     = filter_input(INPUT_POST, 'senderEmail', FITER_VALIDATE_EMAIL);
 
// on intercepte tout de suite les robots et tous les champs sont obligatoires
if (empty($_POST['spambot'])
        && ( ! (empty($mail) && empty($_POST['senderName']) && empty($_POST['message']))))
{
    $send = mail(
        'Clément <clemen@domaine.fr>',
        'Un message en provenance du site',
        preg_replace("/(From:|To:|BCC:|CC:|Subject:|Content-Type:)/", "", $_POST['message']),
        "From: {$_POST['senderName']} <{$mail}>"
    );
 
    if ($send) {
        $response = "{ status: 'success' }";
    }
}
 
header('content-type: application/json');
echo $response;
exit;

croisage des doigts

[Sventovit]

… et elles s’affichent.
Chacune des alertes m’indiquent le contenu.
Mais, me faisant passer pour un robot en remplissant le champ spambot,
avec ce code en haut :

Code :

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

1
2
3
4
 
if ( ! empty($_POST['spambot'])) {
    // non-humain
}

je reçois mes spams.

[Sventovit]

Martin, nos posts se sont croisés et je viens de lire le tien qui nécessite que je me repose un peu avant de l’analyser et le tester.
Permets-moi de revenir demain matin pour te dire ce qu’il est advenu.
En tous cas merci à tous.
Ce fut, sympathique, amusant et très intéressant.
Bonne soirée.
À demain.