如何使用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

我在第一个 sn-p 中注释了第 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 内置函数用于输出名为 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 有很大不同。