使用AJAX POST表单数据

时间:2014-05-26 17:49:56

标签: php jquery ajax forms post

您好我正在尝试对我的联系表单进行一些验证,之后使用AJAX发送数据,验证效果很好,并且通过HTML中的本机方式发送,但是当我尝试这样做时抛出AJAX索引仍然令人耳目一新,而且AJAX的指标不起作用......这是我的代码,有什么问题?

jquery:

$('form').submit(function (e)
{
    var illegalchars=/[^a-zA-Zא-ת\ ]/;
    var phonechars=/[^0-9\-]/;
    var mailfilter=/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;

    var errorDiv = $(".form_error");

    var fullName = $("input[name='full_name']").val();
    var phone = $("input[name='phone']").val();
    var email = $("input[name='email']").val();
    var text = $("textarea[name='text']").val();
    var time = $("textarea[name='time']").val();
    var robCheck = $("textarea[name='rob_check']").val();

    if ( fullName == '' || phone == '' || email == '' || text == '') {
        errorDiv.html('אחד השדות ריק, וודא כי כל השדות מלאים');
        errorDiv.fadeIn('slow');
        setTimeout("$('.form_error').fadeOut(1000);", 3000);
        return false;
    };

    if ( fullName.length < 4 || phone.length < 4 || email.length < 4 || text.length < 4) {
        errorDiv.html("באחד מהשדות הזנת מס' תווים נמוך מהרצוי");
        errorDiv.fadeIn('slow');
        setTimeout("$('.form_error').fadeOut(1000);", 3000);
        return false;
    };

    if ( phonechars.test(phone) ){
        errorDiv.html("הזנת תויים לא חוקיים בשדה של הטלפון");
        errorDiv.fadeIn('slow');
        setTimeout("$('.form_error').fadeOut(1000);", 3000);
        return false;
    }

    if ( !mailfilter.test(email) ){
        errorDiv.html("הזנת תויים לא חוקיים בשדה של האימייל");
        errorDiv.fadeIn('slow');
        setTimeout("$('.form_error').fadeOut(1000);", 3000);
        return false;
    }

    if ( illegalchars.test(fullName) ){
        errorDiv.html("הזנת תויים לא חוקיים בשדה של השם המלא");
        errorDiv.fadeIn('slow');
        setTimeout("$('.form_error').fadeOut(1000);", 3000);
        return false;
    }

    $.ajax({
            url: "send_contact.php",
            type: "POST",
            data: ("#contact_form").serialize(),
            timeout:5000,
            dataType: "php",
            async:true, // TRUE=Continue scripting, FALSE=Stop Everything
            beforeSend:function(){
                $('#loader').css({
                    "display":"block"
                })
                return false;
            },
            error: function(){
                errorDiv.html('משהו השתבש');
                errorDiv.fadeIn('slow');
                setTimeout("$('.form_error').fadeOut(1000);", 3000);
                return false;
            },
            success: function(msg){

                if(msg == 'problem'){
                    errorDiv.html('משהו השתבש');
                    errorDiv.fadeIn('slow');
                }
                else{
                    errorDiv.css({"background":"rgba(60,196,0,1)"})
                    errorDiv.html('עודכן בהצלחה');
                    errorDiv.fadeIn('slow');
                }

                setTimeout("$('.form_error').fadeOut(1000);", 3000);
                return false;
            },
            complete: function(){
                setTimeout("$('.form_error').fadeOut(1000);", 3000);
                return false;
            }
        });

    e.preventDefault();
});

HTML:

<form id="contact_form" method="post" action="send_contact.php">
                <div class="right">
                    <input type="text" name="full_name" placeholder="שם מלא:" /><br />
                    <input type="tel" name="phone" placeholder="טלפון:" /><br />
                    <input type="text" name="email" placeholder="אימייל:" /><br />
                    <input type="hidden" name="time" value="<?php echo ($date); ?>" />
                    <input type="hidden" name="rob_check" value="" />
                </div>
                <div class="left">
                    <textarea name="text"></textarea><br />
                    <input type="submit" name="submit" value="שלח!" />
                </div>
                <div class="breaker"></div>
                <div class="form_error"></div>
            </form>

PHP:

<?php

if ( $_POST['rob_check'] != ""){
    echo 'you have a problem with your form!!';
    return false;
    die();
}

else if( isset( $_POST['submit'] ) ){

$name = trim( $_POST["full_name"] );
$email = trim( $_POST["email"] );
$phone = trim( $_POST["phone"] );
$text = trim( $_POST["text"] );
$time = $_POST["time"];

//print_r($_POST);die();

$to = 'adirkandel@gmail.com';
$subject = "פורטפוליו";
//$headers = '';
$message = "
    <html>
        <head lang='he'>
        <title>$subject</title>
        </head>
        <body dir='rtl'>
            <h2>נושא ההודעה: $subject</h2>
            <p>$text</p>
        <hr />
            <table>
                <tr>
                    <th>שם השולח</th>
                    <th>טלפון השולח</th>
                    <th>אימייל השולח</th>
                    <th>נכתב בתאריך</th>
                </tr>
                <tr>
                    <td>$name</td>
                    <td>$phone</td>
                    <td>$email</td>
                    <td>$time</td>
                </tr>
            </table>
        </body>
    </html>
    ";

$message = str_replace("\'", '&#39;', str_replace('\"', '&#34;', $message)); //remove slash before qoutes

// Always set content-type when sending HTML email
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";

// More headers
//$headers .= 'From: <webmaster@example.com>';
//$headers .= 'Cc: myboss@example.com' . "\r\n";

mail($to,$subject,$message,$headers);
}

header("Location: index.php");

?>

好的家伙我发现了所有问题:
1.我需要添加&#34; $&#34;之前&#34;数据:(&#34; #contact_form&#34;)。serialize()&#34;谢谢你Subha!。

2.我需要添加&#34;&amp; submit = submit&#34;到&#34;数据:$(&#34; #contact_form&#34;)。serialize()&#34;像这样:数据:$(&#34;#contact_form&#34;)。serialize()+&#34;&amp; submit = submit&#34 ;,因为我需要将值发布到&#34;提交&#34; ;。

3.我意外地写了&#34; dataType:&#39; php&#39;&#34;而不是&#39; html&#39;。 谢谢大家的帮助!

1 个答案:

答案 0 :(得分:1)

您在以下行中缺少$符号..

data:(“#contact_form”)。serialize(),

这应该是 -

数据:$(“#contact_form”)。serialize(),