如何使用javascript将json数据显示为html

Question

我有这个php api，

$db_result_set = $db->prepare('SELECT p.Id, p.FirstName, p.MiddleName, p.LastName, p.Gender, p.Location, p.Email, p.Mobile,b.BookTitle, b.BookGenre, b.BookWriter, b.BookDescription FROM personaldetails AS p LEFT JOIN bookdetails AS b ON b.UserId = p.Id ORDER BY p.Id DESC');
$db_result_set->execute();

$final = [];
foreach ($db_result_set as $u) {


if (!is_array($final[$u["Id"]])) {    //line 14

        $final[$u["Id"]]= [
            "Id" => $u["Id"],
            "FirstName" => $u["FirstName"],
            "MiddleName" => $u["MiddleName"],
            "LastName" => $u["LastName"],
            "Gender" => $u["Gender"],
            "Location" => $u["Location"],
            "Email" => $u["Email"],
            "Mobile" => $u["Mobile"],
        ];
    }
    $final[$u["Id"]]["books"][] = [
        "BookTitle" => $u["BookTitle"],
        "BookGenre" => $u["BookGenre"],
        "BookWriter" => $u["BookWriter"],
        "BookDescription" => $u["BookDescription"],
     ];

}
echo "<pre>";
        print_r($final);
        echo "</pre>

";

正在创建这个json数据，

 Array
(
    [80] => Array
        (
        [Id] => 80
        [FirstName] => Ranjan
        [MiddleName] => Kumar
        [LastName] => Gupta
        [Gender] => Male
        [Location] => kolkata
        [Email] => ranjan.gupta.1994@gmail.com
        [Mobile] => 1234567890
        [books] => Array
            (
                [0] => Array
                    (
                        [BookTitle] => one
                        [BookGenre] => one
                        [BookWriter] => one
                        [BookDescription] => one
                    )

                [1] => Array
                    (
                        [BookTitle] => two
                        [BookGenre] => two
                        [BookWriter] => two
                        [BookDescription] => two
                    )

                [2] => Array
                    (
                        [BookTitle] => three
                        [BookGenre] => three
                        [BookWriter] => three
                        [BookDescription] => three
                    )

                [3] => Array
                    (
                        [BookTitle] => four
                        [BookGenre] => four
                        [BookWriter] => four
                        [BookDescription] => four
                    )

                [4] => Array
                    (
                        [BookTitle] => five
                        [BookGenre] => FIVE
                        [BookWriter] => FIVE
                        [BookDescription] => FIVE
                    )

            )

    )

[79] => Array
    (
        [Id] => 79
        [FirstName] => Elon
        [MiddleName] => 
        [LastName] => Musk
        [Gender] => Male
        [Location] => New York
        [Email] => elonmusk@tesla.com
        [Mobile] => 1234567890
        [books] => Array
            (
                [0] => Array
                    (
                        [BookTitle] => who am i
                        [BookGenre] => inspiration
                        [BookWriter] => modi
                        [BookDescription] => this book is all about the struggle one faces all his life.no matter what he does he never get any attention
                    )

                [1] => Array
                    (
                        [BookTitle] => a walk to remember
                        [BookGenre] => romance
                        [BookWriter] => peter
                        [BookDescription] => a wall in the rainy season where all 
                    )

            )

    )

我想通过迭代在html中显示它，但是这样做有些困难，

html中的javascript，

        <!-- posting jason --->

    <div class="col-md-12">
        <div class="col-md-7">
            <script type=text/javascript>


                var loading = true; 
                var ListingCountPage=1;

                function loadData(){
                    var url = "http://localhost/ReadExchange/api.php";
                    $.getJSON(url,function(data) {



                    alert("Roger that"+JSON.stringify(data));



                    });
                }



        $(function() {
            loadData();

        });
        </script>

并且当我以json回显数据时也会出错，

Notice: Undefined offset: 71 in /opt/lampp/htdocs/ReadExchange/api.php on line 14

我在第一个片段中注释了第14行。

提前感谢！

Answer 1

我会将PDO::FETCH_OBJ和json_encode()用于此

$db_result_set = $db->prepare('SELECT p.Id, p.FirstName, p.MiddleName, p.LastName, p.Gender, p.Location, p.Email, p.Mobile,b.BookTitle, b.BookGenre, b.BookWriter, b.BookDescription FROM personaldetails AS p LEFT JOIN bookdetails AS b ON b.UserId = p.Id ORDER BY p.Id DESC');
$db_result_set->setFetchMode(PDO::FETCH_OBJ);
$db_result_set->execute();
while($obj = $db_result_set->fetch()) {  
    $arr[] = $obj;
}
if (count($arr) >= 1){
        echo '{"marker":'.json_encode($arr).'}';
}

Answer 2

有一个PHP-inbuild函数，用于输出名为json_encode()的JSON。在您的情况下，这将是这样的（如果您的PHP脚本中没有其他输出）：

$db_result_set = $db->prepare('SELECT p.Id, p.FirstName, p.MiddleName, p.LastName, p.Gender, p.Location, p.Email, p.Mobile,b.BookTitle, b.BookGenre, b.BookWriter, b.BookDescription FROM personaldetails AS p LEFT JOIN bookdetails AS b ON b.UserId = p.Id ORDER BY p.Id DESC');
$db_result_set->execute();

$final = [];
foreach ($db_result_set as $u) {


if (!is_array($final[$u["Id"]])) {    //line 14

        $final[$u["Id"]]= [
            "Id" => $u["Id"],
            "FirstName" => $u["FirstName"],
            "MiddleName" => $u["MiddleName"],
            "LastName" => $u["LastName"],
            "Gender" => $u["Gender"],
            "Location" => $u["Location"],
            "Email" => $u["Email"],
            "Mobile" => $u["Mobile"],
        ];
    }
    $final[$u["Id"]]["books"][] = [
        "BookTitle" => $u["BookTitle"],
        "BookGenre" => $u["BookGenre"],
        "BookWriter" => $u["BookWriter"],
        "BookDescription" => $u["BookDescription"],
     ];

}
header('Content-type: application/javascript');
echo json_encode($final);

作为旁注：每次请求只调用一次json_encode() - 这样可以保证输出有效。

print_r()不适合输出JSON，因为它的格式与正确的JSON非常不同。