Ajax,JSON对象与php的交互

时间:2016-01-15 07:31:08

标签: javascript php jquery json ajax

我是JSON和ajax的新手。基本上我试图从mysql数据库&获取事件列表将它们作为JSON编码文件发送回.ajax()&显示该功能的那些事件列表。我尝试了不同的方式,但我不认为我在正确的轨道上。作为Ajax和JSON的新手,使用ajax发送和接收数据有点令人困惑但很有趣

JSON对象和数组让我感到困惑,我不知道如何访问内部元素而感到震惊

$.ajax({ 
...
...
...
})
.done(function(result)
{
})

result是对象,数组还是字符串?我应该在这里使用JSON.parse()方法,还是应该直接使用result来处理和显示数据?

这是我的后端php文件的输入格式,

{"data": 
    {
        "dept": "CSE"
    }
}

此输入来自下拉列表

$("#dept_drop_down").on("change", function() {
...
...
})

我的php文件的输出格式是,

{
  "data": {
    "status": "success",
    "response_code": "202",
    "events": {
      "1": {
        "name": "Help Dexter",
        "desc": "Help Dexter to Solve the Puzzle",
        "coordinate": "1307",
        "dept": "CSE"
      },
      "2": {
        "name": "Code Hunt",
        "desc": "Lets hunt the CODE ..!!",
        "coordinate": "2145",
        "dept": "CSE"
      }
    }
  }
}

请帮助我使用JavaScript代码发送输入格式JSON并接收输出格式JSON并使用AJAX(上面给出的输入和输出格式)显示它们。

等待你的帮助。提前谢谢......

这是我的代码......

$(document).ready(function(){ 
    $("#dept_drop_down").on("change", function(){ 
        var dat = $(document.getElementById("dept")).serializeJSON();
        var postdata = JSON.stringify(dat); 
        $.ajax({ 
            url: "elist.php", 
            type: "POST", 
            data: postdata, 
            datatype: 'application/json', 
            error: function(xhr,a,b){alert("This is "+xhr.status)}, 
            beforeSend: function(){alert("Sending.......")}, 
            success:function(result){ 
                var obj=result; 
                d=$.parseJSON(result); 
                if(obj.data.resopnse_code==202)
                { 
                    //object processing .. Here is the place i need help
                }
                else if(obj.data.response_code==200)
                { 
                    //object processing .. Here is the place i need help
                } 
                else if(obj.data.response_code==201)
                { 
                    //object processing .. Here is the place i need help
                } 
                else if(obj.data.response_code==400)
                { 
                    //object processing .. Here is the place i need help
                } 
            }    
        });     
    }); 
});

2 个答案:

答案 0 :(得分:1)

结果是一个字符串。您可以使用jQuery.parseJSON创建一个JSON对象。

var jsonObj = jQuery.parseJSON( result );

您可以使用您创建的变量(在我的示例 jsonObj 中)和元素名称访问内部元素。

假设你想要JSON中第二个事件的坐标,你可以用

访问它
jsonObj.events.data[1].coordinate

这是:

  • jsonObj:访问主JSON对象
  • data:访问 jsonObj
  • 中的数据元素
  • 事件:访问数据中的事件
  • 1:访问 events 元素中的 1 元素
  • 坐标:第二个事件元素中的坐标

那将返回字符串“1307”

总的来说,Ajax并不是那么难以获得它并且你似乎已经很好地掌握了它。

这是一个操场:http://codepen.io/anon/pen/WrZQrj

答案 1 :(得分:0)

这一切都取决于您的PHP脚本作为Content-Type返回到调用的内容。例如,让我们说我们有一个json.json文件,其中包含上面的对象文本,我可以像这样编写PHP脚本:

<?php

$content =file_get_contents ('json.json') ;
echo $content ; // I echo a string here
die ;

Ajax调用将接收文本字符串,因为调用默认为text / plain Content-Type

$.post ('php.php', {}, function (ret, status) {
    alert (ret) ; // Will alert text
    if ( typeof ret === 'string' )
        ret =JSON.parse (ret) ;
    alert (ret) ; // Will alert [Object] [Object]
    // ret.data.status == 'success'
}) ;

现在,如果我的PHP脚本执行以下操作:

<?php

$content =file_get_contents ('json.json') ;
header ('Content-Type: application/json') ;
echo $content ; // I echo a string here still
die ;

不同。现在我得到了一个JSON对象:

$.post ('php.php', {}, function (ret, status) {
    alert (ret) ; // Will alert [Object] [Object]
    if ( typeof ret === 'string' ) // << will not execute anymore
        ret =JSON.parse (ret) ;
    alert (ret) ; // Will alert [Object] [Object]
    // ret.data.status == 'success'
}) ;

我在第二个中留下了if()和JSON.parse(),但在最后一个案例中它们不再使用了。

最后一件事,在PHP代码中我回复了一个来自文件的字符串,但是如果你有一个由脚本构建的对象,这里是代码

$content =(object)[] ;
$content.data =(object)[ "status" => "success" } ;
...
header ('Content-Type: application/json') ;
echo json_encode ($content) ; // I echo a string here
die ;