javascript - 无法通过自定义按钮刷新 Kendo Grid?

标签 javascript asp.net-mvc kendo-ui kendo-grid kendo-asp.net-mvc

我已经尝试了 stackoverflow 和其他页面上建议的许多不同方法,但仍然无法刷新 Kendo Grid 上的数据。应用以下方法时遇到“TypeError: $(...).data(...) is undefined”错误。有什么帮助吗?

<div id="grid"></div>
<button id="refresh" class="k-button" onclick="Refresh()">Refresh</button>


<script>
    var grid = $("#grid").kendoGrid({
        //code omitted for brevity
        dataSource: {
            type: "json",
            transport: {
                read: {
                    url: "/Event/Event_Read",
                    dataType: "json",
                    cache: false
                    }
            },
            schema: {
                model: {
                    fields: {
                        CardNo: { type: 'number' }
                        //code omitted for brevity                         
                    }
                }
            }
        },
        pageable: {
            pageSize: 15,
            refresh: true
        },
        filterable: true,
        columns:
        [
            { field: "CardNo", title: "Card No", filterable: true }
            //code omitted for brevity              
        ]
    }).data("kendoGrid");

    function Refresh() {
        $("#grid").data("kendoGrid").dataSource.read();
        $("#grid").data("kendoGrid").refresh();
    }
</script>

最佳答案

您好,试试这个代码,包含以下 css 和 js,然后尝试重新加载网格。

<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="styles/kendo.common.min.css" />
<link rel="stylesheet" href="styles/kendo.default.min.css" />

<script src="js/jquery.min.js"></script>
<script src="js/kendo.all.min.js"></script>
</head>
<body>
<div id="grid"></div>
<button id="refresh" class="k-button" onclick="Refresh()">Refresh</button>


<script type="text/javascript">
$(function () {
var grid = $("#grid").kendoGrid({
    //code omitted for brevity
    dataSource: {
        type: "json",
        transport: {
            read: {
                url: "/Event/Event_Read",
                dataType: "json",
                cache: false
                }
        },
        schema: {
            model: {
                fields: {
                    CardNo: { type: 'number' }
                    //code omitted for brevity                         
                }
            }
        }
    },
    pageable: {
        pageSize: 15,
        refresh: true
    },
    filterable: true,
    columns:
    [
        { field: "CardNo", title: "Card No", filterable: true }
        //code omitted for brevity              
    ]
}).data("kendoGrid");

function Refresh() {
    $("#grid").data("kendoGrid").dataSource.read();
    $("#grid").data("kendoGrid").refresh();
}
});
</script>

为我工作并供引用看看this telerik 网站。

关于javascript - 无法通过自定义按钮刷新 Kendo Grid?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34116118/

相关文章:

javascript - 在对象中使用 this 内部函数定义不起作用

javascript - 如何从 Javascript 将参数传递到新页面?

javascript - asp.net mvc 从 Html.TextBoxFor() 获取值

c# - IIS 10.0 最大请求长度 .NET MVC

javascript - kendo ui Q3 网格导出到内置的 excel 不起作用?

mvvm - kendo 将 HTML 元素绑定(bind)到网格选定的行/数据项

javascript - HTML5 canvas javascript 将图像分割为 6x6

javascript - 准确计算两个日期之间的天数(包括时间)

javascript - 如何防止在某些情况下显示剑道工具提示?

javascript - SyntaxError : JSON. 解析:React 应用程序上 JSON 数据的第 1 行第 1 列出现意外字符