Question

我正在使用bootstrap验证程序来验证我的表单数据。如果表单已经过验证，我将这些数据发布到php。在PHP我正在返回json字符串。即使我的帖子成功并获得正确的响应，我也无法访问json对象。

$('#dealForm')
    .bootstrapValidator({
        message: 'This value is not valid',
        fields: {
            deal_description: {
                message: 'The deal discription is not valid',
                validators: {
                    notEmpty: {
                        message: 'The deal discription is required and can\'t be empty'
                    }
                }
            }
        }
    })
    .on('success.form.bv', function(e) {
        // Prevent form submission
        e.preventDefault();

        // Get the form instance
        var formObj = $(e.target);

        var formURL = formObj.attr("action");

        $.ajax({
            url: formURL,
            type: "POST",
            data:  new FormData(this),
            contentType: false,
            cache: false,
            processData:false,
            dataType:JSON
        }).done(function(data) {
                console.log(data);
            });
    });

调试器输出

enter image description here

PHP

$temp= $_POST['deal_description'];
        if(!empty($_FILES['userfile']['name'])){$temp2='has';} else $temp2='no has';
        echo json_encode(array(
            'message' => $temp,
            'test' => $temp2
        ));

Answer 1

在php中设置正确的标题：

header('Content-Type: application/json');
echo json_encode(array(
        'message' => $temp,
        'test' => $temp2
    ));

或在js中使用JSON.parse：

}).done(function(data) {
    data = JSON.parse(data);
    console.log(data);
    alert(data.mesage);
        });

编辑只是注意到你的js中也有拼写错误。 data.mesage应该有两个data.message

Answer 2

我认为你的AJAX请求是错误的。它应该是

function getData(){
    $.ajax({
        url: formURL,
        type: "POST",
        data: new FormData(this),
        contentType: 'application/json; charset=utf-8',
        cache: false,
        dataType: 'json'
    }).success(function (data) {
        console.log(data);
        workWithData(data);
    }).done(function(e){
        console.log("I'm done");
    });
}

function workWithData(data){
    if (typeof data != 'undefined') {
        var jsonData = $.parseJSON(data);
        // do stuff with data
    }
}

在第二个函数中使用它的原因是它是一个回调。我们不知道AJAX请求可能需要多长时间，因此我们不能在等待响应时中断页面的执行。通过使用回调，当数据最终到达时，它将被处理。

我建议您仔细阅读以了解有关AJAX请求的更多信息http://api.jquery.com/jquery.ajax/

Answer 3

尝试

.done(function(data) {
        var res=$.parseJSON(data);
        alert(res.message);       
  });

Jquery函数无法访问json对象

3 个答案: