显示 Json 数据 jQuery PHP MySQL答案

【问题标题】：Display Json data jQuery PHP MySQL显示 Json 数据 jQuery PHP MySQL
【发布时间】：2016-04-26 15:44:10
【问题描述】：

我无法找到我的问题的答案...事实是我对 jQuery 和 JSON 不熟悉。

在登录页面上，我想在页面加载时显示顶级客户和顶级曲目。我通过 php 的 echo 显示它们，但我想创建 JSON 对象并将其发送到 login ...循环并在无序列表中显示。

你们能帮我创建 JSON 并在 jquery 中显示它吗？

这是我的代码：

jQuery:

/*  Function to load top Customers  */
    function loadCustomers() {

        /* Create data string to call functions in php*/
        var dataString ="function1=loadCustomers&function2=loadTracks";

        $.ajax({
            type:"GET",
            url: "login.php",
            data: dataString,
            dataType: "json",

            success: function(data) {
                $("#error").show();
                $("#errormsg").html(data.FirstName);

                //how can i display Json data in unordered list ? #customerList

            },

            error: function() {
                $("#error").show();
                $("#errormsg").text("cant display data");
            }

        });
    }

PHP：

 }else if ($_SERVER["REQUEST_METHOD"] == "GET") {

    //JSON customers array
    $customers = array();


    if ($_GET["function1"] == "loadCustomers") {
        try {

            $customerStmt = $conn->prepare("Select customer.FirstName, customer.LastName, customer.City, sum(invoice.Total) from invoice INNER JOIN customer on invoice.CustomerId = customer.CustomerId group by invoice.CustomerId order by sum(invoice.total) DESC LIMIT 5");
            $customerStmt->execute();

            $customerRows = $customerStmt->fetchAll();

            //how to create JSON data to send it

           header("Content-type: application/json");
           echo json_encode($customerRows);

        }catch (PDOException $e) {
            $e->getMessage();
        }
    }

【问题讨论】：

标签： javascript php jquery mysql json

【解决方案1】：

好吧，从代码看来，您正在响应多个客户，但在 jQuery 中，您直接访问数据而不访问数组。所以它应该是这样的

$.ajax({
    type:"GET",
    url: "login.php",
    data: dataString,
    dataType: "json",

    success: function(data) {
        var items = [];
        $.each( data, function( key, val ) {
            items.push( "<li id='" + key + "'>" + val + "</li>" );
        });

        $( "<ul/>", {
            "class": "my-new-list",
            html: items.join( "" )
        }).appendTo( "#customerList" );
    },

    error: function() {
        $("#error").show();
        $("#errormsg").text("cant display data");
    }
});

【讨论】：

【解决方案2】：

问题是我无法从 PHP 接收 JSON 数据。经过数小时的谷歌搜索和尝试不同的解决方案，我终于发现了一个错误..

当您从数据库中读取时，您必须将其设置为 utf-8 字符集。

我正在使用 utf8_encode 函数在代码中解决此问题... 您必须在 PDO 对象的新定义中设置它：

 $conn= new PDO("mysql:host=$server;dbname=$database;charset=utf8", $user, $password);
    $conn->setAttribute(PDO::ATTR_ERRMODE,PDO::ERRMODE_EXCEPTION);

在此更改后，我正在发送 JSON 数据。

【讨论】：