AJAX联络表格无效

Question

I have a problem with my AJAX Contact Form, every thing I tried failed. I allways get the error from the jQuery Part if(html==0) .

Someone please help, can't find the problem. Thank you!

jQuery Part: action.js

$(function() {

    /* EMAIL VALIDATOR */
    function isEmail(email) {
        var pattern = new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][\d]\.|1[\d]{2}\.|[\d]{1,2}\.))((25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\.){2}(25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\]?$)/i);
        return pattern.test(email);
    }

    /* CONTACT */
    $('#contact-submit').click(function() {
        var firstname = $('#contact-firstname').val();
        if(!firstname.trim()) {
            $('#contact-firstname').focus();
            $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie Ihren Vornamen ein!</span>');
            return false;
        }
        var lastname = $('#contact-lastname').val();
        if(!lastname.trim()) {
            $('#contact-lastname').focus();
            $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie Ihren Nachnamen ein!</span>');
            return false;
        }
        var email = $('#contact-email').val();
        if(!email.trim()) {
            $('#contact-email').focus();
            $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie Ihre E-Mail ein!</span>');
            return false;
        } else {
            if(!isEmail(email)) {
                $('#contact-email').focus();
                $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie eine g&uuml;ltige E-Mailadresse ein!</span>');
                return false;  
            }
        }
        var phone1 = $('#contact-phone1').val();
        if(!phone1.trim()) {
            $('#contact-phone1').focus();
            $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie Ihre Landesvorwahl ein!</span>');
            return false;
        }
        var phone2 = $('#contact-phone2').val();
        if(!phone2.trim()) {
        $('#contact-phone2').focus();
            $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie Ihre Telefonnummer ein!</span>');
            return false;
        }
        var phone = phone1+' (0) '+phone2;
        var subject = $('#contact-subject').val();
        if(!subject.trim()) {
            $('#contact-subject').focus();
            $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie einen Betreff ein!</span>');
            return false;
        }
        var message = $('#contact-message').val();
        if(!message.trim()) {
            $('#contact-message').focus();
            $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Bitte geben Sie eine Nachricht ein!</span>');
            return false;
        }

        $.ajax({
            type:   'POST',
            url:    'action.php',
            data:   'contact=1&firstname='+firstname+'&lastname='+lastname+'&email='+email+'&phone='+phone+'&subject='+subject+'&message='+message,
            dataType: 'html',
            success: function(html) {
                if(html==0) {
                    $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Nachricht konnte nicht gesendet werden!</span>');
                } else if(html==1) {
                    $('#contact-result').html('Danke f&uuml;r Ihre Nachricht!');
                } else {
                    alert('Fehler beim Senden!');
                }
            }
        });
        return false;
    });
});

PHP Part: action.php

<? if($_POST['contact']) {
    $contactEmail = 'contact@pixel-factory.at';

    $firstname  = $_POST['firstname'];
    $lastname   = $_POST['lastname'];
    $email      = $_POST['email'];
    $phone      = $_POST['phone'];
    $subject    = $_POST['subject'];
    $message    = $_POST['message'];

    $mailSubject = 'KONTAKTANFRAGE '.$subject;

    $mailMessage =  $message.'\r\n'.'\r\n';
    $mailMessage .= 'Vorname: '.$firstname.'\r\n';
    $mailMessage .= 'Nachname: '.$lastname.'\r\n';
    $mailMessage .= 'E-Mail: '.$email.'\r\n';
    $mailMessage .= 'Telefonnummer: '.$phone;

    $mailHeader =   'MIME-Version: 1.0'.'\r\n';
    $mailHeader .=  'Content-type:text/html;charset=UTF-8'.'\r\n';
    $mailHeader .=  'From: Kontkatformular'.'\r\n';
    $mailHeader .=  'Reply-To: '.$email.'\r\n';

    $sendMail = mail($contactEmail, $mailSubject, $mailMessage, $mailHeader);

    if($sendMail) {
        echo 1;
    } else {
        echo 0;
    }
} ?>

Answer 1

Try to change your initilization data

 $.ajax({
            type:   'POST',
            url:    'action.php',
            data:   {contact: 1, firstname:firstname,lastname:lastname, email:email, phone:phone, subject:subject, message:message},
            dataType: 'html',
            success: function(html) {
                if(html==0) {
                    $('#contact-result').html('<span class="error"><i class="fa fa-exclamation-triangle fa-fw"></i>&nbsp;Nachricht konnte nicht gesendet werden!</span>');
                } else if(html==1) {
                    $('#contact-result').html('Danke f&uuml;r Ihre Nachricht!');
                } else {
                    alert('Fehler beim Senden!');
                }
            }
        });

Answer 2

I would suggest you the use of json to parse the data.

So your javascript code would look like this:

$.post('action.php', 
{
   'contact'   : 1,
   'firstname' : firstname,
   'lastname'  : lastname
}).done(function(response)
{
   var json = JSON.parse(response);

   if(json.status == false)
      /* do something */

   else if(json.status == true)
      /* do something */

   else /* This might never happen.. */
      /* do something else */
});

And your PHP code would look like this:

$status = $sendMail == TRUE ? TRUE : FALSE;

echo json_encode(array
(
   'status' => $status
));

Answer 3

Your headers need to end with newlines. Single quotes will just put out the actual characters \\r\\n , while double quotes will convert them to new lines. Your mail is probably failing due to bad headers, so adjust them like this:

$mailHeader =   'MIME-Version: 1.0'."\r\n";
$mailHeader .=  'Content-type:text/html;charset=UTF-8'."\r\n";
$mailHeader .=  'From: Kontkatformular'."\r\n";
$mailHeader .=  'Reply-To: '.$email."\r\n";

If it's still not sending the email, you'll need to look at your mail server logs to see where the issue may lie.

Answer 4

That's the solution:

$mailHeader =   'MIME-Version: 1.0'."\r\n";
$mailHeader .=  'Content-type:text/html;charset=UTF-8'."\r\n";
$mailHeader .=  'From: Kontkatformular <no-reply@pixel-factory.at>'."\r\n";
$mailHeader .=  'Reply-To: '.$email."\r\n";