jQuery AJAX请求从PHP返回NULL

时间:2016-04-24 11:23:12

标签: php jquery ajax wordpress

以下是我正在为Wordpress网站制作的代码:

jQuery的:

jQuery(document).ready(function($)
{
    var actionValue;

    $(".tabRow li").on('click', function(event)
    {
            event.preventDefault(); //override default behaviour

            var clicked = $(this); //caches click so we don't scan DOM again

            if(clicked.attr('id')=="tabAddData") //tab1 clicked
            {
                    actionValue = "tab1Clicked";
            }

            $("li").removeClass("selected");
            clicked.addClass("selected");

            alert ('starting ajax call');
            $.ajax(
                    ajaxObject.ajaxurl, //request gets sent to this url
                    { //start of [options]
                            type: 'POST',

                            dataType: 'json', //type of data expected back from server

                            //data to send to server (JSON format)
                            data:
                            {
                                    action: 'ajaxAction',
                                    nonce: ajaxObject.nonce,
                                    actionName: actionValue
                            }
                    } //end of [options]
            ) //end ajax(), the other fuctions are chained to it (.done .fail .always)

            .done (function(data)
            {
                    alert ('success function');
                    if(actionValue == "tab1Clicked") //tab1 clicked
                    {
                            $('#dataSection').empty();
                            $('#dataSection').append(data);
                    }
            }) //end of done (success) function

            .fail (function(xhr, desc, err)
            {
                    alert ('error function');
                    console.log(xhr);
                    console.log("Details: " + desc + "\nError:" + err);
            }) //end of fail (error) function
    }); //end of onclick
});

PHP:

<?php
$my_action='ajaxAction';

if(defined('DOING_AJAX') && DOING_AJAX)//check if AJAX is loaded and working
{
    //for logged in users
    add_action('wp_ajax_'.$my_action, 'ajaxResponse');
}

function ajaxResponse()
{
    if(wp_verify_nonce($_POST['nonce'], 'ajaxAction'))
    {
            if($_POST['actionName'] == "tab1Clicked")
            {
                    $addDataSection = getAddDataSection();
                    $response=array(
                            'status' => 'success',
                            'addDataSection' => $addDataSection
                    );
                    header('Content-type:application/json;charset=utf-8');
                    echo json_encode($response);//encodes the jQuery array into json format
                    die;
            }
    }
}

function getAddDataSection()
{   
    //lots of echo statements which builds the html code
}
?>

首次加载页面时,我的PHP函数getAddDataSection()会在<div id='dataSection>内生成HTML。这很好。

当我点击tab1时,我的jQuery AJAX调用应该重用相同的PHP函数来生成我的HTML。这正常工作。

单击tab1后,将触发jQuery失败功能。

当我检查Firebug时,响应数据包含我的PHP函数getDataSection()生成的html,后跟一个JSON字符串

{"status":"success","addDataSection":null}

回复时,请记住我是新手。谢谢:))

已更新,其中包含控制台错误:

Details: parsererror
Error:SyntaxError: JSON.parse: unexpected character at line 2 column 1 of the JSON data

1 个答案:

答案 0 :(得分:0)

我想我找到了解决方案。

在我的jQuery中,我将dataType从json更改为html。

然后在我的PHP中,我改变了这个:

            if($_POST['actionName'] == "tab1Clicked")
            {
                    $addDataSection = getAddDataSection();
                    $response=array(
                            'status' => 'success',
                            'addDataSection' => $addDataSection
                    );
                    header('Content-type:application/json;charset=utf-8');//still works without this line
                    echo json_encode($response);//encodes the jQuery array into json format
                    die;
            }

到此:

            if($_POST['actionName'] == "tab1Clicked")
            {
                    $addDataSection = getAddDataSection();
                    echo $addDataSection;
                    die;
            }