JSON输出未显示

4

我有一个PHP文件,能够以JSON格式输出。以下是代码 -

<?php
    include 'configure.php';
    $qr = "SELECT * FROM student_details";
    $res= mysql_query($qr);
    $i=0;
    while($row = mysql_fetch_array($res))
         {
         $stud_arr[$i]["full_name"] = $row["full_name"];
         $stud_arr[$i]["reg_no"] = $row["regno"];
         $stud_arr[$i]["address"] = $row["address"];
         $stud_arr[$i]["mark1"] = $row["mark1"];
         $stud_arr[$i]["mark2"]= $row["mark2"];
         $stud_arr[$i]["mark3"] = $row["mark3"];
    $i++;
     }
    header('Content-type: application/json'); 
    echo json_encode($stud_arr);
    ?>

当我在我的服务器上运行这个文件时,它可以完美地给我返回结果,即所有学生的详细信息和他们的分数,如下所示 -
[{"full_name":"Lohith","reg_no":"100","address":"street, lane","mark1":"90","mark2":"87","mark3":"88"},{"full_name":"Ranjeet","reg_no":"101","address":"dfkljg","mark1":"56","mark2":"45","mark3":"39"},{"full_name":"karthik","reg_no":"102","address":"askjldf","mark1":"85","mark2":"90","mark3":"100"}]

现在我正在尝试使用以下方法将其显示在HTML文件中 -
function getAllDetails()
{
var myTable = '' ;
myTable += '<table id="myTable" cellspacing=0 cellpadding=2 border=1>' ;
  myTable +=   "<tr><td><b>No</b></td><td><b>Full Name</b></td><td><b>Mark1</b></td><td><b>Mark2</b></td><td><b>Mark3</b></td></tr>";var url = "json-example2.php";
  $.getJSON(url, function(json) { $.each(json, function(v) {    
                myTable +=   "<tr><td>"+v.reg_no+"</td><td>"+v.full_name+"</td><td>"+v.mark1+
                "</td><td>"+v.mark2+
                "</td><td>"+v.mark3+
                "</td></tr>";   });

                $("#stud_tbl").html(myTable);});};

上述代码显示了一个表格,但是每个数据单元格中都显示"undefined"。
    No  Full Name     Mark1           Mark2           Mark3
undefined   undefined   undefined   undefined   undefined
undefined   undefined   undefined   undefined   undefined
undefined   undefined   undefined   undefined   undefined

请帮忙调试这个问题。

可能是重复的问题:如何从AJAX调用中返回响应? - Bergi
4个回答

3
jQuery.each()的第一个参数是值的索引,第二个参数是值本身。

解决方案:将$.each(json, function(v) {更改为$.each(json, function(i, v) {

function getAllDetails() {
  var myTable = '';
    myTable += '<table id="myTable" cellspacing=0 cellpadding=2 border=1>';
    myTable += "<tr><td><b>No</b></td><td><b>Full Name</b></td><td><b>Mark1</b></td><td><b>Mark2</b></td><td><b>Mark3</b></td></tr>";
    var url = "data.json";
    $.getJSON(url, function(json) {
                $.each(json, function(i, v) {
                            myTable += "<tr><td>" + v.reg_no + "</td><td>"
                                    + v.full_name + "</td><td>" + v.mark1
                                    + "</td><td>" + v.mark2 + "</td><td>"
                                    + v.mark3 + "</td></tr>";
                        });

                $("#stud_tbl").html(myTable);
            });
};

演示: Plunker

0

请尝试以下操作。这里有一个演示:http://jsfiddle.net/H3cjC/3/

HTML 代码如下:

<div class="tbl">
</div>

var data='[{"full_name":"Lohith","reg_no":"100","address":"street, lane","mark1":"90","mark2":"87","mark3":"88"},{"full_name":"Ranjeet","reg_no":"101","address":"dfkljg","mark1":"56","mark2":"45","mark3":"39"},{"full_name":"karthik","reg_no":"102","address":"askjldf","mark1":"85","mark2":"90","mark3":"100"}]'
data=$.parseJSON(data);
var myTable = '' ;
myTable += '<table id="myTable" cellspacing=0 cellpadding=2 border=1>' ;
  myTable +=   "<tr><td><b>No</b></td><td><b>Full Name</b></td><td><b>Mark1</b></td><td><b>Mark2</b></td><td><b>Mark3</b></td></tr>";var url = "json-example2.php";
 $.each(data, function(i,v) {    
   myTable +=   "<tr><td>"+data[i].reg_no+"</td><td>"+data[i].full_name+"</td>   <td>"+v.mark1+
                "</td><td>"+data[i].mark2+
                "</td><td>"+data[i].mark3+
                "</td></tr>";   
 });
$('.tbl').html(myTable);

0

你必须使用each函数的第二个参数。

function getAllDetails()
    {
    var myTable = '' ;
    myTable += '<table id="myTable" cellspacing=0 cellpadding=2 border=1>' ;
    myTable +=   "<tr><td><b>No</b></td><td><b>Full Name</b></td><td><b>Mark1</b></td><td><b>Mark2</b></td><td><b>Mark3</b></td></tr>";
    var url = "SCRIPTNAME.php";
    $.getJSON(url, function(json) { $.each(json, function(v, x) {
        console.log("REG NR = "+x.reg_no);
        myTable +=   "<tr><td>"+x.reg_no+"</td><td>"+x.full_name+"</td><td>"+x.mark1+
            "</td><td>"+x.mark2+
            "</td><td>"+x.mark3+
            "</td></tr>";   });

        $("#stud_tbl").html(myTable);
    });
    }

0

$.each有两个参数,一个是index,另一个是value

      $.each(json, function(index, value) {
                        myTable += "<tr><td>" + value.reg_no + "</td><td>"
                                + value.full_name + "</td><td>" + value.mark1
                                + "</td><td>" + value.mark2 + "</td><td>"
                                + value.mark3 + "</td></tr>";
                    });

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接