如何删除或隐藏筛选操作符下拉列表

时间:2016-11-04 19:36:56

标签: javascript kendo-ui kendo-grid

filterMenuInit事件未在我的网格上触发。我希望 AccountNumber 字段有一个过滤器,但是我想完全删除或隐藏下拉列表,它表示"等于","不包含&#34 ;等等。删除下拉列表的代码是filterMenuInit配置,但在网格加载时函数不会触发。这是我的代码:

<div id="grid"></div>
    <script>
        $(document).ready(function() {
            $("#grid").kendoGrid({
                dataSource: {
                    transport: {
                        read: "/api/client"
                    },
                    schema: {
                        model: {
                            fields: {
                                ClientID: { type: "number" },
                                Name: { type: "string" },
                                Branch: { type: "string" },
                                Department: { type: "string" },
                                AccountNumber: { type: "number" }
                            }
                        }
                    },
                    pageSize: 20,
                    serverPaging: false,
                    serverFiltering: false,
                    serverSorting: true
                },
                height: 500,
                scrollable: true,
                filterable: {
                    mode: "row",
                    extra: "false"
                },
                filterMenuInit: function(e) {
                    if (e.field === "AccountNumber") {
                    var firstValueDropDown = e.container.find("select:eq(0)").data("kendoDropDownList");

                        setTimeout(function () {
                            firstValueDropDown.wrapper.hide();
                        })
                    }
                },
                sortable: false,
                pageable: true,
                columns: [{
                    field: "AccountNumber",
                    width: "150px",
                    title: "Account #"
                }, {
                    field: "Branch",
                    filterable: false,
                    width: "100px",
                    title: "Branch"
                }, {
                    field: "Department",
                    filterable: false,
                    width: "100px",
                    title: "Department"
                }, {
                    field: "Name",
                    template: '<a href="/client/#=ClientID#">#=Name#</a>',
                    title: "Client Name"
                }, {
                    filterable: "false",
                    template: '<span class="glyphicon glyphicon-file"></span><a href="/client/#=ClientID#/invoice">View Invoices</a>',
                    width: "150px"
                }, {
                    filterable: "false",
                    template: '<span class="glyphicon glyphicon-list-alt"></span> <a href="/client/#=ClientID#/workorder">View Work Orders</a>',
                    width: "150px"
                }
            ]
            });
        });
    </script>

在浏览器中输入调试模式,事件永远不会触发,因此下拉列表仍然有效。

1 个答案:

答案 0 :(得分:1)

您可以在列定义中使用以下代码

filterable: {
    cell: {
        showOperators: false
    }
}

或者您可以在架构中定义它是数字,它也将解决它

这是demo