时间戳

首页 > 解决方案 > 搜索任何剑道网格字段，无论其列名如何

asp.net-mvc - 搜索任何剑道网格字段，无论其列名如何

问题描述

是否可以搜索所有列而不单独列出它们？我的问题是会定期添加新列，我不想每次都回来添加列标题。例如，在下面的代码中，而不是列出“姓名”、“电话”、“电子邮件”等。是否有一些代码可以用来基本上说明该列是否存在以将其包含在过滤器中？

提前致谢！

$(document).ready(function () {
    $("#FieldFilter1").keyup(function () {

        var value = $("#FieldFilter1").val();
        grid = $("#UnclaimedLeadsGrid").data("kendoGrid");

        if (value) {
            grid.dataSource.filter({
                logic: "or",
                filters: [
                    { field: "Name", operator: "contains", value: value },
                    { field: "Phone", operator: "contains", value: value },
                    { field: "Email", operator: "contains", value: value },
                    { field: "Address", operator: "contains", value: value },
                    { field: "City", operator: "contains", value: value },
                    { field: "State", operator: "contains", value: value },
                    { field: "ZipCode", operator: "contains", value: value },
                    { field: "Subject", operator: "contains", value: value },
                    { field: "Message", operator: "contains", value: value },
                    { field: "FirstName", operator: "contains", value: value },
                    { field: "LastName", operator: "contains", value: value }
                ]
            });
        } else {
            grid.dataSource.filter({});
        }
    });
});

标签： asp.net-mvckendo-uikendo-grid

解决方案

这听起来像是Search Panel的工作。

您将Search Panel作为toolbar选项添加到网格中：

toolbar: ["search"]

搜索框将出现在网格的右上角。搜索将对网格中的所有列运行“包含”过滤器。

这是上面链接的演示页面中的示例：

<script>
    $(document).ready(function () {
        $("#grid").kendoGrid({
            dataSource: {
                type: "odata",
                transport: {
                    read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
                },
                pageSize: 20
            },
            height: 550,
            toolbar: ["search"],
            pageable: {
                refresh: true,
                pageSizes: true,
                buttonCount: 5
            },
            columns: [{
                template: "<div class='customer-photo'" +
                    "style='background-image: url(../content/web/Customers/#:data.CustomerID#.jpg);'></div>" +
                    "<div class='customer-name'>#: ContactName #</div>",
                field: "ContactName",
                title: "Contact Name",
                width: 240
            }, {
                field: "ContactTitle",
                title: "Contact Title"
            }, {
                field: "CompanyName",
                title: "Company Name"
            }, {
                field: "Country",
                width: 150
            }]
        });
    });
</script>

推荐阅读