Question

我试图创建一个可以使用jquery从mysql数据库显示一些数据的网站，但我无法弄清楚如何用数据填充我的表。我的PHP文件如下所示：

<?php
$servername = "localhost";
$database = "testdatabase";
$username = "root";
$password = "";

// Create connection
$conn = new mysqli($servername, $username, $password, $database);
// Check connection

if ($conn->connect_error) 
{
  die("Connection failed: " . $conn->connect_error);
}
$getinfo = "SELECT * FROM greenhouse";
$names = $conn->query($getinfo);
$str = array(); 
if ($names->num_rows > 0) {
    // output data of each row
    while($res = $names->fetch_array(MYSQL_ASSOC)) {
        $str[] = $res;
    }
}

echo json_encode($str);
?>

这是我的剧本：

<script>


function get_greenhouses(){
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            //var returnval = JSON.parse(xmlhttp.responseText);
            //document.getElementById("main_text").innerHTML = dataSet[0];
            start_table(JSON.parse(xmlhttp.responseText));
            //document.getElementById("main_text").innerHTML = returnval[0].Name;
        }
    }
    xmlhttp.open("GET","get_greenhouses.php", true);
    xmlhttp.send();
  }

  function start_table(greenhousedata){
    console.log(greenhousedata);
    //document.getElementById("main_text").innerHTML = greenhousedata[0].Adress;
       $('#example1').DataTable( {
        "ajax": greenhousedata,
        columns: [
            { title: "Name" },
            { title: "ID" },
            { title: "plant type" },
            { title: "install date" },
            { title: "adress" }
        ]
    } );
  }
$(function () {
    get_greenhouses();
  });
</script>

所以我试图让一个函数get_greenhouses（）在文档加载时启动。在其中，我向获取数据的PHP文件发出请求，将其编码为json，然后将其发回。当我得到数据时，我想将它传递给start_table（）函数，然后用它来填充表格。现在我收到的错误是： DataTables警告：table id = example1 - 无效的JSON响应。有关此错误的详细信息，请参阅http://datatables.net/tn/1 但是，当我按照链接并检查我从php文件中获取的数据时，它说json并且看起来正确，据我所知。

有人可以告诉我我做错了什么，或者是否有更好的做法？

Answer 1

请使用下面显示的代码。

只需输入greenhouse表的正确字段名称，而不是data选项指定的虚拟字段名称。

function get_greenhouses(){
   $('#example1').DataTable( {
      ajax: {
         url: "get_greenhouses.php",
         dataSrc: ""
      },
      columns: [
          { data: "name",       title: "Name" },
          { data: "id",         title: "ID" },
          { data: "plant",      title: "Plant type" },
          { data: "dt_install", title: "Install date" },
          { data: "address",    title: "Address" }
      ]
   });
}

Answer 2

ajax选项用于传递url，以便插件发出ajax请求。在您的情况下，您自己提出请求并将数据直接传递给插件

您可以通过将数据传递到插件选项的data属性来继续您的方法。见example

$('#example1').DataTable( {
        "data": greenhousedata,

或者让插件自己发出请求

Answer 3

我首先尝试了charlietfls解决方案并得到了另一个错误但是在谷歌搜索15分钟后我发现我发现我要说什么列应该使用哪些部分数据，所以不要只是{title：＆＃34; Name＆＃34; }，我不得不使用{title：＆＃34; Name＆＃34;，＆＃34; data＆＃34;：＆＃34; Name＆＃34;之后，它就像一个魅力。

之后，我阅读了Gyrocode.com的回答并尝试了它，如果我更改数据，它也像魅力一样工作：字段以匹配我的输入数据。因为这个解决方案让我废弃了get_greenhouses函数，而是选择了它。

感谢大家的帮助：）

将DataTable与json一起使用

3 个答案: