javascript MVC Kendo Grid 自定义过滤器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23940399/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
MVC Kendo Grid Custom Filter
提问by littleGreenDude
Basically, I am looking for the MVC version of this demo:
基本上，我正在寻找这个演示的 MVC 版本：
http://demos.telerik.com/kendo-ui/grid/filter-menu-customization
http://demos.telerik.com/kendo-ui/grid/filter-menu-customization
Here is what I currently have:
这是我目前拥有的：
.Columns(columns =>
{
columns.Bound(e => e.ID)
.Hidden();
columns.Bound(e => e.SearchFunctionCode)
.Hidden();
columns.Bound(e => e.SearchFunctionDesc)
.Title("Search Function")
.Filterable( *** WHAT GOES HERE? *** )
.HtmlAttributes(new { style = "text-align: center" })
.HeaderHtmlAttributes(new { style = "text-align: center" });
Do I still reference the javascript, or is there another approach?
我仍然参考javascript，还是有另一种方法？
<script type="text/javascript">
function SearchFunctionFilter(element) {
element.kendoDropDownList({
dataSource: searchfunctions(),
optionLabel: "--Select Value--"
});
}
</script>
回答by malkam
Yes we need to define specified filter functions in javascript like below.
是的，我们需要在 javascript 中定义指定的过滤器函数，如下所示。
.Columns(columns => {
columns.Template(@<text>@item.FirstName @item.LastName</text>)
.ClientTemplate("#=FirstName# #=LastName#")
.Title("Name");
columns.Bound(e => e.City)
.Filterable(filterable => filterable.UI("cityFilter"))
.Width(200);
columns.Bound(e => e.Title)
.Filterable(filterable => filterable.UI("titleFilter"))
.Width(350);
})
.Filterable(filterable => filterable
.Extra(false)
.Operators(operators => operators
.ForString(str => str.Clear()
.StartsWith("Starts with")
.IsEqualTo("Is equal to")
.IsNotEqualTo("Is not equal to")
))
)
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("FilterMenuCustomization_Read", "Grid"))
)
)
<script type="text/javascript">
function cityFilter(element) {
element.kendoDropDownList({
dataSource: {
transport: {
read: "@Url.Action("FilterMenuCustomization_Cities")"
}
},
optionLabel: "--Select Value--"
});
}
function titleFilter(element) {
element.kendoAutoComplete({
dataSource: {
transport: {
read: "@Url.Action("FilterMenuCustomization_Titles")"
}
}
});
}
</script>
see this
看到这个
http://demos.telerik.com/aspnet-mvc/grid/filter-menu-customization
http://demos.telerik.com/aspnet-mvc/grid/filter-menu-customization
回答by John Lord
Malkan's answer should work. All you need to do is have a separate filter on each column. just replace the column "filterable" with whatever you like like this:
Malkan 的回答应该有效。您需要做的就是在每列上设置一个单独的过滤器。只需将“可过滤”列替换为您喜欢的任何内容：
.Filterable(filterable => filterable
.Extra(false)
.Operators(operators => operators
.ForString(str => str.Clear()
.StartsWith("Starts with")
.IsEqualTo("Is equal to")
.IsNotEqualTo("Is not equal to")
))
)
