Почему нельзя показать данные, переданные getJSON? - PullRequest
Новая
       5

Почему нельзя показать данные, переданные getJSON?

0 голосов
/ 11 сентября 2018

test-json.php прочитает базу данных и подготовит ее в формате JSON. 

<?php
$conn = new mysqli("localhost", "root", "xxxx", "guestbook"); 
$result=$conn->query("select * From lyb limit 2"); 
echo '[';
$i=0;
while($row=$result->fetch_assoc()){  ?>
 {title:"<?= $row['title'] ?>",
        content:"<?= $row['content'] ?>",
        author:"<?= $row['author'] ?>",
        email:"<?= $row['email'] ?>",
        ip:"<?= $row['ip'] ?>"}
<?php 
if(
$result->num_rows!=++$i) echo ',';   
}
echo ']'    
?>

Для моей базы данных select * From lib limit 2 получите записи. 

title    | content   | author   | email            |ip
welcome1 | welcome1  | welcome1 | welcome1@tom.com |59.51.24.37
welcome2 | welcome2  | welcome2 | welcome2@tom.com |59.51.24.38

php-f /var/www/html/test-json.php

[ {title:"welcome1",
         content:"welcome1",
        author:"welcome1",
         email:"welcome1@tom.com",
        ip:"59.51.24.37"},
{title:"welcome2",
         content:"welcome2",
        author:"welcome2",
         email:"welcome2@tom.com",
        ip:"59.51.24.38"}]

test-json.php получить некоторые данные в формате JSON.

Теперь для обратного вызова данных и отображения их в таблице. 

<script src="http://127.0.0.1/jquery-3.3.1.min.js"></script>
<h2 align="center">Ajax show data in table</h2>
<table>
    <tbody id="disp">
        <th>title</th>
        <th>content</th>
        <th>author</th>
        <th>email</th>
        <th>ip</th>
    </tbody>
</table>

<script> 
$(function(){
    $.getJSON("test-json.php", function(data) {
        $.each(data,function(i,item){
            var tr = "<tr><td>" + item.title + "</td>"    +
                        "<td>"  + item.content  + "</td>" +
                        "<td>"  + item.author  + "</td>"  +
                        "<td>"  + item.email  + "</td>"   +
                        "<td>"  + item.ip  + "</td></tr>"
            $("#disp").append(tr);
        });
    });
});
</script>

Введите 127.0.0.1/test-json.html, почему test-json.php не создает данные на веб-странице?

Что я получаю, как показано ниже: 

Ajax show data in table
title   content author  email   ip

Чтоя ожидаю, как показано ниже: 

Ajax show data in table
title   content author  email   ip
welcome1  welcome1  welcome1  welcome1@tom.com  59.51.24.37
welcome2  welcome2  welcome2  welcome2@tom.com  59.51.24.38

Ответы [ 2 ]

0 голосов
/ 11 сентября 2018

В вашем коде PHP много ошибок.

Вот как все должно обрабатываться на стороне сервера (PHP):

имя файла: test-json.php

  1. Извлечение записей из базы данных.

  2. Заполнение массива (я назвал этот массив $data в приведенном ниже коде) записями, которые уже получены из базы данных.

  3. Кодирование этого массива в формате JSON и вывод результата.

Вот как все должно обрабатываться на стороне клиента (JavaScript):

Сделайте AJAX запрос к файлу test-json.php.

Если этот запрос был выполнен успешно, переберите возвращенный JSON и заполните переменную (Я назвал его 'html'), который будет содержать весь код HTML (вместе с полученными данными), который будет добавлен в таблицу.

Добавить эту переменную (которую я назвал«html»), с этим мы повышаем производительность, когда получаем доступ к DOM только один раз за AJAX запрос.

При всем вышесказанном, вот решение:

PHP код - имя файла: test-json.php: 

<?php
// use the column names in the 'SELECT' query to gain performance against the wildcard('*').
$conn = new MySQLi("localhost", "root", "xxxx", "guestbook"); 

$result = $conn->query("SELECT `title`, `content`, `author`, `email`, `ip` FROM `lyb` limit 2"); 

// $data variable will hold the returned records from the database.
$data = [];

// populate $data variable.
// the '[]' notation(empty brackets) means that the index of the array is automatically incremented on each iteration.
while($row = $result->fetch_assoc()) {
  $data[] = [
    'title'   => $row['title'],
    'content' => $row['content'],
    'author'  => $row['author'],
    'email'   => $row['email'],
    'ip'      => $row['ip']
  ];
}

// convert the $data variable to JSON and echo it to the browser.
header('Content-type: application/json; charset=utf-8');
echo json_encode($data);

JavaScript код 

$(function(){
    $.getJSON("test-json.php", function(data) {
        var html = '';
        $.each(data,function(key, value){
            html += "<tr><td>" + value.title + "</td>"    +
                        "<td>"  + value.content  + "</td>" +
                        "<td>"  + value.author  + "</td>"  +
                        "<td>"  + value.email  + "</td>"   +
                        "<td>"  + value.ip  + "</td></tr>";

        });
        $("#disp").append(html);
    });
});

Подробнее о функции json_encode.

Надеюсь, я подтолкнул вас дальше.

0 голосов
/ 11 сентября 2018

Проблема в том, что ответ от вашего PHP-скрипта недопустим. JSON.

В JSON ключи объекта должны быть заключены в кавычки.

Вместо того, чтобы пытаться свернуть свой собственный ответ JSON,используйте json_encode(), чтобы сделать это за вас.Например, 

<?php
$conn = new mysqli("localhost", "root", "xxxx", "guestbook"); 
$stmt = $conn->prepare('SELECT title, content, author, email, ip FROM lyb limit 2');
$stmt->execute();
$stmt->bind_result($title, $content, $author, $email, $ip);
$result = [];
while ($stmt->fetch()) {
    $result[] = [
        'title'   => $title,
        'content' => $content,
        'author'  => $author,
        'email'   => $email,
        'ip'      => $ip
    ];
}
header('Content-type: application/json; charset=utf-8');
echo json_encode($result);
exit;

Вам не нужно использовать prepare() и bind_result(), это мое предпочтение при работе с MySQLi.

Это приведет кчто-то вроде 

[
  {
    "title": "welcome1",
    "content": "welcome1",
    "author": "welcome1",
    "email": "welcome1@tom.com",
    "ip": "59.51.24.37"
  },
  {
    "title": "welcome2",
    "content": "welcome2",
    "author": "welcome2",
    "email": "welcome2@tom.com",
    "ip": "59.51.24.38"
  }
]
...