试图将数据从mysql加载到jsgrid中

时间:2017-03-29 14:35:08

标签: php jquery json ajax jsgrid

我刚刚开始学习ajax

这里我试图从jsgrid中的mysql加载一个简单表(name-details(name,age))中的数据。

我有两个2个文件1)index.php 2)hello.php在同一个文件夹中

index.php

<Doctype! HTML></Doctype!>
<html>
    <head>
        <link type="text/css" rel="stylesheet" href="css/jsgrid.min.css" />
        <link type="text/css" rel="stylesheet" href="css/jsgrid-theme.min.css" />

    </head>

    <body>
        <div id="jsGrid"></div>

        <script src="js/jquery-3.1.1.min.js"></script>
        <script  src="js/jsgrid.min.js"></script>
        <script src="js/main.js"></script>
    </body>
</html>

hello.php

<?php

    switch($_SERVER["REQUEST_METHOD"]) {

        case "GET":

            $dbhost = "localhost";  
            $dbuser = "root";
            $dbpsw = "";    
            $dbname= "tp";

            @$dbh = new PDO("mysql:host=$dbhost;dbname=$dbname", $dbuser, $dbpsw);
            $dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
            $dbh->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);
            $data = array();
            $stmt = $dbh->prepare("SELECT * FROM details"); 
            $stmt->execute();

            $affected_rows = $stmt->rowCount(); //Rows count

            if ($affected_rows == 0) {

                echo "no data";
                exit();
            }

            foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $row) {

                $data[] = $row;

            }
            echo json_encode($data);
            break;

    }

?>

main.js

$(document).ready(function(){ 

    $("#jsGrid").jsGrid({
        width: "70%",
        height: "400px",
        inserting: true,
        editing: true,
        sorting: true,
        paging: true,
        filtering:true,
        controller: {
            loadData: function(filter) {
                return $.ajax({
                    type: "GET",
                    url: "hello.php",
                    data: filter
                });
            }
        },
        fields: [
            { name: "name", title: "Name", type: "text", width: 150 },
            { name: "age", title: "Age", type: "number", width: 50, filtering: false },
            { type: "control" }
        ]
    });
});

hello.php显示了数据库中完美的数据输出,但在index.php jsgrid中没有数据加载到not found,并显示fb://publish/?text=test fb://post/test fb://dialog/feed?app_id=fb_app_id&display=touch&href=test fb://publish/post/?text=test

请帮助。 提前谢谢。

0 个答案:

没有答案