しばらく中断していたプロジェクトに戻ってきました。ボタンを押すと表示されるページ (debatecalendar.com) の上部に単純なフォームがあります。
フォームに入力すると、成功の通知が届きますが、メールが届かないようです。バグを修正する方法がわからない。どんな助けでも大歓迎です！
ホームページのコードは
// Init the form once the document is ready
jQuery( init );
// Initialize the form
function init() {
// Hide the form initially.
// Make submitForm() the forms submit handler.
// Position the form so it sits in the centre of the browser window.
jQuery('#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
jQuery('a[href="#contactForm"]').click( function() {
jQuery('#content').fadeTo( 'slow', .2 );
jQuery('#contactForm').fadeIn( 'slow', function() {
jQuery('#senderName').focus();
} )
return false;
} );
// When the "Cancel" button is clicked, close the form
jQuery('#cancel').click( function() {
jQuery('#contactForm').fadeOut();
jQuery('#content').fadeTo( 'slow', 1 );
} );
// When the "Escape" key is pressed, close the form
jQuery('#contactForm').keydown( function( event ) {
if ( event.which == 27 ) {
jQuery('#contactForm').fadeOut();
jQuery('#content').fadeTo( 'slow', 1 );
}
} );
}
// Submit the form via Ajax
function submitForm() {
var contactForm = jQuery(this);
// Are all the fields filled in?
if ( !jQuery('#senderName').val() || !jQuery('#senderEmail').val() || !jQuery('#message').val() ) {
// No; display a warning message and return to the form
jQuery('#incompleteMessage').fadeIn().delay(messageDelay).fadeOut();
contactForm.fadeOut().delay(messageDelay).fadeIn();
} else {
// Yes; submit the form to the PHP script via Ajax
jQuery('#sendingMessage').fadeIn();
contactForm.fadeOut();
jQuery.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 = jQuery.trim( response );
jQuery('#sendingMessage').fadeOut();
if ( response == "success" ) {
// Form submitted successfully:
// 1. Display the success message
// 2. Clear the form fields
// 3. Fade the content back in
jQuery('#successMessage').fadeIn().delay(messageDelay).fadeOut();
jQuery('#senderName').val( "" );
jQuery('#senderEmail').val( "" );
jQuery('#message').val( "" );
jQuery('#content').delay(messageDelay+500).fadeTo( 'slow', 1 );
} else {
// Form submission failed: Display the failure message,
// then redisplay the form
jQuery('#failureMessage').fadeIn().delay(messageDelay).fadeOut();
jQuery('#contactForm').delay(messageDelay+500).fadeIn();
}
}
次に、processForm.php のフォームの処理に進みます。
<?php
// Define some constants
define( "RECIPIENT_NAME", "Debate Calendar" );
define( "RECIPIENT_EMAIL", "events@debatecalendar.com" );
define( "EMAIL_SUBJECT", "Feedback or Add Event" );
// Read the form values
$success = false;
$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 ( $senderName && $senderEmail && $message ) {
$recipient = RECIPIENT_NAME . " <" . RECIPIENT_EMAIL . ">";
$headers = "From: " . $senderName . " <" . $senderEmail . ">";
$success = mail( $recipient, EMAIL_SUBJECT, $message, $headers );
}
// Return an appropriate response to the browser
if ( isset($_GET["ajax"]) ) {
echo $success ? "success" : "error";
} else {
?>
<html>
<head>
<title>Thanks!</title>
</head>
<body>
<?php if ( $success ) echo "<p>Thanks for sending your message! We'll get back to you shortly.</p>" ?>
<?php if ( !$success ) echo "<p>There was a problem sending your message. Please try again.</p>" ?>
<p>Click your browser's Back button to return to the page.</p>
</body>
</html>
<?php
}
?>
このコードはすべて、さまざまなオンラインの例からマッシュアップされたものであり、混乱を解消するための助けをいただければ幸いです!