php ajax表單提交..什么都沒有發生

Question

我有一個PHP Ajax表單，試圖提交Zendesk API調用。 每當我使用ajax部件時，為了使用戶保持在同一頁面上，它將不起作用。 當我刪除<script>部分時，它可以正常工作，但是顯然可以從contact.html重定向到contact.php ，因此我認為問題出在Ajax部分，而不是PHP部分。

這是我的HTML表單：

<html>
        <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        </head>
        <body>
        <div class="box_form">

        <form id="zFormer" method="POST" action="contact.php" name="former">
        <p>
        Your Name:<input type="text" value="James Duh" name="z_name">
        </p>
        <p>
        Your Email Address: <input type="text" value="duh@domain.com" name="z_requester">
        </p>
        <p>
        Subject: <input type="text" value="My Subject Here" name="z_subject">
        </p>
        <p>
        Description: <textarea name="z_description">My Description Here</textarea>
        </p>
        <p>
        <input type="submit" value="submit" id="submitter" name="submit">
        </p>
        </form>
        </div>

        <div class="success-message-subscribe"></div>
        <div class="error-message-subscribe"></div>


<script>
jQuery(document).ready(function() {

$('.success-message-subscribe').hide();
$('.error-message-subscribe').hide();

    $('.box_form form').submit(function() {
        var postdata = $('.box_form form').serialize();
        $.ajax({
            type: 'POST',
            url: 'contact.php',
            data: postdata,
            dataType: 'json',
            success: function(json) {
                if(json.valid == 1) {
                    $('.box_form').hide();

                    $('.error-message-subscribe').hide();
                    $('.success-message-subscribe').hide();
                    $('.subscribe form').hide();
                    $('.success-message-subscribe').html(json.message);
                    $('.success-message-subscribe').fadeIn();
                }
            }
        });
        return false;
    });

});
</script>

        </body>
        </html>

和PHP部分：

您可能會忽略其中大部分內容，因為當我不使用Ajax時它可以工作。 僅最后幾行給出響應$array['valid'] = 1; 然后應該由上面的if(json.valid == 1) 。

<?php
        ( REMOVED API CALL CODE FROM ABOVE HERE )

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

        foreach($_POST as $key => $value){
            if(preg_match('/^z_/i',$key)){
                $arr[strip_tags($key)] = strip_tags($value);
            }
        }
        $create = json_encode(array('ticket' => array(

        'subject' => $arr['z_subject'], 
        'comment' => array( "body"=> $arr['z_description']), 
        'requester' => array('name' => $arr['z_name'], 
        'email' => $arr['z_requester'])

        )));

        $return = curlWrap("/tickets.json", $create, "POST");


        $array = array();
        $array['valid'] = 1;
        $array['message'] = 'Thank you!';
        echo json_encode($array);


  ?>

任何想法為什么這不起作用？

Answer 1

將jQuery（document）.ready（function（）{替換為

$(document).ready(function() {

其次，來自Jquery文檔：

注意：只有“成功控件”才被序列化到字符串。 由於沒有使用按鈕提交表單，因此沒有序列化提交按鈕的值。 為了使表單元素的值包含在序列化的字符串中，該元素必須具有name屬性。 僅當選中復選框和單選按鈕（“ radio”或“ checkbox”類型的輸入）中的值時，才包括這些值。 來自文件選擇元素的數據未序列化。

因此，提交按鈕將不會通過jQuery.serialize（）函數進行序列化。

下面的解決方案：

<script>
$(document).ready(function() {

$('.success-message-subscribe').hide();
$('.error-message-subscribe').hide();

    $('#submitter').click(function(e) {
        e.preventDefault();
        $myform = $(this).parent('form');
        $btnid = $(this).attr('name');
        $btnval = $(this).attr('value');
        var postdata = $myform.serialize();
        $.ajax({
            type: 'POST',
            url: 'contact.php',
            data: { "btnid" : $btnid, "btnval": $btnval, "form-data": $form.serialize() },
            dataType: 'json',
            success: function(json) {
                if(json.valid == 1) {
                    $('.box_form').hide();

                    $('.error-message-subscribe').hide();
                    $('.success-message-subscribe').hide();
                    $('.subscribe form').hide();
                    $('.success-message-subscribe').html(json.message);
                    $('.success-message-subscribe').fadeIn();
                }
            }
        });
        return false;
    });

});
</script>

Answer 2

我希望您使用contact.php作為相對URL不能正確解析。 檢查您的JavaScript控制台，您應該看到一個錯誤，表明發布失敗。 將contact.php更改為www.your_domain.com/contact.php ，它應該可以正常工作

php ajax表單提交..什么都沒有發生

問題描述

2 個解決方案

解決方案1
1 2015-03-08 19:08:46

解決方案2
1 已采納 2015-03-08 19:22:30

php ajax表單提交..什么都沒有發生

問題描述

2 個解決方案

解決方案1 1 2015-03-08 19:08:46

解決方案2 1 已采納 2015-03-08 19:22:30

解決方案1
1 2015-03-08 19:08:46

解決方案2
1 已采納 2015-03-08 19:22:30