kendo-ui - 在过滤过程中显示弹出 View

Question

在我小组的项目中，我们只有一个网格和导出按钮。我们遇到了一个问题，即当以 excel 格式 fiddle 提取数据时:http://jsfiddle.net/SZBrt/11/需要显示弹出消息，说明“正在过滤数据”，以便我们可以知道过滤正在进行中。提前感谢您的帮助。

还有我的代码:

      var grid = $("#grid").kendoGrid({
        dataSource: {
            type           : "odata",
            transport      : {
                read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
            },
            schema         : {
                model: {
                    fields: {
                        OrderID  : { type: "number" },
                        Freight  : { type: "number" },
                        ShipName : { type: "string" },
                        OrderDate: { type: "date" },
                        ShipCity : { type: "string" }
                    }
                }
            },
            pageSize       : 10
        },
        filterable: true,
        sortable  : true,
        pageable  : true,
        columns   : [
            {
                field     : "OrderID",
                filterable: false
            },
            "Freight",
            {
                field : "OrderDate",
                title : "Order Date",
                width : 100,
                format: "{0:MM/dd/yyyy}"
            },
            {
                field: "ShipName",
                title: "Ship Name",
                width: 200
            },
            {
                field: "ShipCity",
                title: "Ship City"
            }
        ]
    }).data("kendoGrid");  

Answer 1

为 requestStart 和 requestEnd 添加到 DataSource 定义的事件处理程序。

dataSource: {
    requestStart : function() {
        // Add code for displaying your own "loading" message
    },
    requestEnd:    function() {
        // Add code for hiding your own "loading" message
    },
    type           : "odata",
            transport      : {
        read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
    },
    schema         : {
        model: {
            fields: {
                OrderID  : { type: "number" },
                Freight  : { type: "number" },
                ShipName : { type: "string" },
                OrderDate: { type: "date" },
                ShipCity : { type: "string" }
            }
        }
    },
    pageSize       : 10
},

您没有指定 Loading 消息的外观，它可能就像添加/删除可见性一样简单:

requestStart: function () {
    $("#loading-msg").css("visibility", "visible");
},
requestEnd: function () {
    $("#loading-msg").css("visibility", "hidden");
},

或打开/关闭一个窗口:

requestStart: function () {
    $("#loading-msg").data("kendoWindow").center().open();
},
requestEnd: function () {
    $("#loading-msg").data("kendoWindow").close();
},