Kendo Grid中的自定义过滤器不起作用

时间:2016-10-27 12:22:11

标签: jquery kendo-ui kendo-grid

我有一个针对剑道网格的自定义过滤器字段,如下所示:

<div id="anforderungen-window-content" class="full-height">

<div id="search-form" class="row-fluid form-search">
    <div class="input-append span11">
        <input id="search-anforderungen-query-input" type="text" class="search-query" placeholder="Suchtext Anforderungen">
        <button id="btn-search-anforderungen" class="btn btn-search"><i class="icon-search"></i></button>
    </div>
</div>

<div id="anforderungen-grid" class="full-height"></div>

@section scripts {
    <script type="text/javascript">



        $(function () {

            amplify.store("CurrentMenuItemId", null);

            var anforderungenGridDataSource = new kendo.data.DataSource({
                batch: true,
                pageSize: 50,
                schema: {
                    model: {
                        id: "Id",
                        fields: {
                            Id: { type: "number", editable: false },
                            Control: { type: "string", validation: { required: true } },
                            Input_Hlp_Info: { type: "string", validation: { required: true } },
                        }
                    }
                },
                transport: {
                    read: {
                        url: actions.common.rootUrl + "api/Anforderungen/",
                        type: "Get"
                    },
                    create: {
                        url: actions.common.rootUrl + "api/Anforderungen",
                        type: "PUT",
                        contentType: 'application/json;charset=utf-8'
                    },
                    update: {
                        url: actions.common.rootUrl + "api/Anforderungen",
                        type: "PUT",
                        contentType: 'application/json;charset=utf-8'
                    },
                    //destroy: {
                    //    url: actions.common.rootUrl + "api/Anforderungen",
                    //    type: "DELETE",
                    //    contentType: 'application/json;charset=utf-8'
                    //},
                    parameterMap: function (data, operation) {
                        if (operation != "read") {
                            return kendo.stringify(data.models);
                        }
                    }
                },
                requestEnd: function (e) {
                    if (e.type == "create") {
                        this.read();
                    }
                },
                change: function (e) {
                    if (e.action == "itemchange") {
                        window.u.dirty = true;
                    }
                }
            });

            var anforderungenGrid = $("#anforderungen-grid").kendoGrid({
                dataSource: anforderungenGridDataSource,
                scrollable: true,
                navigatable: true,
                sortable: true,
                columnMenu: true,
                selectable: "row",
                editable: {
                    confirmation: "Ausgewählte Anforderung löschen?",
                },
                pageable: {
                    pageSizes: [50, 100, 200],
                    refresh: true,
                },
                filterable: true,
                resizable: true,
                columnMenu: true,
                height: 500,
                change: onAnforderungenSelected,
                columns: [
                    {
                        field: "Id",
                        title: "ID",
                        width: "20px"
                    },
                    {
                        field: "Control",
                        title: "Control",
                        width: "200px"
                    },
                    {
                        field: "Input_Hlp_Info",
                        title: "HlpText",
                        width: "300px"
                    },

                ]
            }).data().kendoGrid;


            function onAnforderungenSelected() {
                var grid = anforderungenGrid.data().kendoGrid;
                var anforderungen;

                grid.select().each(function () {
                    var dataItem = grid.dataItem($(this));
                    anforderungen = dataItem;
                });

                amplify.store("Anforderungen", anforderungen);
            }

            function SearchAnforderungen() {
                var searchValue = $("#search-anforderungen-query-input").val();
                if (searchValue) {
                    var filter = new Array();
                    var anforderungenFilter = { logic: "or", filters: [] };

                    anforderungenFilter.filters.push({ field: "Input_Hlp_Info", operator: "contains", value: searchValue });
                    anforderungenFilter.filters.push({ field: "Control", operator: "contains", value: searchValue });

                    filter.push(anforderungenFilter);
                    anforderungenGrid.data().kendoGrid.dataSource.filter(filter);
                } else {
                    anforderungenGrid.data().kendoGrid.dataSource.filter(new Array());
                }
            }

            $("#anforderungen-window-content").bind("keyup", function (e) {
                SearchAnforderungen();
            });




            anforderungenGrid.bind('dataBound', function (e) {
                this.element.find('tbody tr:first').addClass('k-state-selected');
            });

            var u = new Anforderungen(anforderungenGrid);
            kendo.bind($("body"), u);

            u.dirty = false;

            window.u = u;

            $(window).bind('beforeunload', function () {
                if (u.dirty) {
                    var isConfirmAktiv = "@UserPrincipal.ConfirmAktiv";
                    if (isConfirmAktiv.toLowerCase() === "true") {
                        setTimeout(function () {
                            amplify.store("SelectedMenuItemId", amplify.store("CurrentMenuItemId"));
                            window.toggleLeftMenuTreeview();
                        }, 4000);
                        return "You have unsaved changes.";
                    }
                }
            });



        });
    </script>
}

我已成功将此方法与其他几个网格一起使用。在演示的情况下,网格正确显示我的数据,但网格不会对[bind(&#34; keyup&#34;,function ..]做出反应,以便过滤数据。

有没有人知道可能是什么问题。

感谢您的帮助。 马努

0 个答案:

没有答案