Question

我在kendoGrid数据表插件的帮助下创建了一个表，其中我在删除表sholud重新加载后执行删除并且不显示已删除的用户但是表没有重新加载并且当我刷新时仍然在表中显示用户用户详细信息将消失的页面我已经厌倦了以下代码，但它无法正常工作注意：删除操作正常工作

<head>
    <script>
        $(function () {
            $("#example").dataTable();
        })
    </script>
    <script>
        $(document).ready(function () {
            $("#example").kendoGrid({dataSource: {
                    pageSize: 10
                },
                editable: "popup",
                sortable: true,
                filterable: {
                    extra: false,
                    operators: {
                        string: {
                            contains: "Contains",
                            startswith: "Starts with"
                        }
                    }
                },
                pageable: true,
            });
        });
    </script>

    <script>
        function deleteuser(obj) {
            var uid = obj.id;
            var uname = obj.name;
            if (confirm("This user '" + uname + "' maybe using some other events, Are you sure to delete this user?")) {


                if (window.XMLHttpRequest) {
                    xmlhttp = new XMLHttpRequest();
                } else {
                    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
                }

                xmlhttp.onreadystatechange = function () {
                    //alert(xmlhttp.responseText.trim());
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                        //alert(xmlhttp.responseText.trim());
                        if (xmlhttp.responseText.trim() == 'deleted') {
                            alert('This user "' + uname + '" succesfully deleted');
$('#example').data('kendoGrid').dataSource.read();
                        } else
                            alert('Error : user cannot deleted');

                    }
                }
                var url = "deleteuser.php?id=" + uid;
                xmlhttp.open("GET", url, true);
                xmlhttp.send();

            }
        }
    </script>
</head>

<body>
    <div>
        <table id="example">
            <thead>
                <tr>
                    <td>Action</td>
                    <td>Name</td>
                    <td>Username</td>
                    <td>Email</td>
                </tr>
            </thead>
            <tbody>
                <?php
                $sql = "SELECT *  from registration";
                $result = $conn->query($sql);
                while ($row = $result->fetch_assoc()) {
                    ?>
                    <tr>
                        <td><button class="btn btn-danger btn-xs" id="<?php echo $row['user_id'] ?>" onClick="deleteuser(this);" name="<?php echo $row['first_name'] ?>" title="Delete"><i class="fa fa-trash-o"></i></button></td>
                        <td><?php echo $row['first_name'] ?></td>
                        <td><?php echo $row['user_name'] ?></td>
                        <td><?php echo $row['email'] ?></td>

                        <?php
                    }
                    ?>
                </tr>
            </tbody>
        </table>
    </div>
</body>

deleteuser.php

<?php
    session_start();
    $id = $_GET['id'];
    include("../model/functions.php");
    $table = "registration";
    $condition = "user_id=" . $id . "";
    $delete = Deletedata($table, $condition);

    if ($delete === TRUE) {
        echo'deleted';
    } else {
        echo 'not deleted';
    }
?>

Answer 1

您无法按原样更新表数据，因为您尚未定义表获取数据的位置。可以刷新整个页面，也可以使用datasource＆amp;创建transport。您可以使用url来获取数据。

填充表服务器端时：

<tbody>
    <?php
    $sql = "SELECT *  from registration";
    $result = $conn->query($sql);
    while ($row = $result->fetch_assoc()) {
        ?>
        <tr>
            <td><button class="btn btn-danger btn-xs" id="<?php echo $row['user_id'] ?>" onClick="deleteuser(this);" name="<?php echo $row['first_name'] ?>" title="Delete"><i class="fa fa-trash-o"></i></button></td>
            <td><?php echo $row['first_name'] ?></td>
            <td><?php echo $row['user_name'] ?></td>
            <td><?php echo $row['email'] ?></td>

            <?php
        }
        ?>
    </tr>
</tbody>

表格没有任何内容可以刷新。

您需要为表格添加数据源以从中获取数据。

通常，我将网格的数据源与网格定义本身分开。

举个例子：

var gridDataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "someurl/to/my/data"
        }
    },
    schema: {
        model: { id: "user_id" }
    }
});

然后你可以像这样定义你的表：

var jgrid = $("#example").kendoGrid({
    columns: [
        {
            field: "first_name",
            title: "First Name"
        },
        {
            field: "user_name",
            title: "User Name",
        },
        {
            field: "email",
            title: "Email"
        }
    ],
    dataSource: gridDataSource
}).data("kendoGrid");

Answer 2

$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();

jquery如何刷新表而不刷新页面？

2 个答案: