在剑道组合框多个过滤器 [英] Multiple filters in Kendo Combobox

查看:286
本文介绍了在剑道组合框多个过滤器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我见过几个例子,无论是FilterType.StartsWith或FilterType.Contains用作过滤器。

I have seen several examples where either the FilterType.StartsWith or FilterType.Contains is used as the filter.

@(Html.Kendo().ComboBox().Name("kcombobox")
    .HtmlAttributes(new { style = "width:250px" })
    .Placeholder("Select a value...")
    .DataTextField("Text")
    .DataValueField("Value")
    .Filter(FilterType.StartsWith)
    .DataSource(source =>
        {
            source.Read(read =>
            {
                read.Action("GetCountries", "Home");
            }).ServerFiltering(true);
        })
)

如何使用多个过滤器在一起。我要筛选的数据,使得结果表明StartsWith的基础上的列表中则包含的基础上的列表中。因此,它会像两个列表的结合。

How to use multiple filters together. I want to filter the data such that the result shows the list on the basis of StartsWith then the list on the basis of Contains. So it would be like the union of the two lists.

推荐答案

塞拉姆哈桑。下面是你需要什么,我在我的项目中使用和完美的作品。它检索参与者根据所选择的倍增器。我用NameSurname财产在我的模型相结合的名和姓,但您可以使用只是一个单一的财产,当然滤波器参数。在另一方面,我为了防止进入自由文本的组合框的用户使用一个额外的JavaScript方法。

Selam Hasan. Here is what you need that I use in my project and works perfectly. It retrieves "Participants" according to the selected "Multiplier". I use NameSurname property by combining Name and Surname on my model, but you can use just a single property as filter parameter of course. On the other hand I used an extra javascript method in order to prevent the users entering free text to the comboboxes.

此外我的样本,你也可以看看< A HREF =http://demos.telerik.com/aspnet-mvc/combobox/cascadingcombobox相对=nofollow>层叠ASP.NET MVC的ComboBox样品。

Besides my sample, you can also have a look at Cascading ASP.NET MVC ComboBox sample.

查看:

@Html.LabelFor(m => m.ParticipantInstituteName)
@(Html.Kendo().ComboBox()
    .Name("multipliers") //The name of the combobox is mandatory. It specifies the "id" attribute of the widget.
    .DataTextField("InstituteName") //Specifies which property of the Model to be used by the combobox as a text.
    .DataValueField("ID") //Specifies which property of the Model to be used by the combobox as a value.
    .HtmlAttributes(new { style = "width:350px" })
    .Placeholder("Type searching text here...")
    .Filter(FilterType.Contains)
     //.MinLength(3)
    .DataSource(source =>
    {
        source.Read(read =>
        {
            read.Action("GetCascadeMultipliers", "Multiplier");
        });
    })
)
@Html.ValidationMessageFor(m => m.ParticipantInstituteName)
<br />

<script>
    $(function () {
    /* Find and select value if exists in Kendo().ComboBox() for preventing from selecting free text entry
    Note: Use this script (inside  $(function () { }); ) on the below of each kendoComboBox "seperately" instead of above of the page or at the same section i.e. below of the same kendoComboBox!!! */
    var widget = $("#multipliers").data("kendoComboBox");
    widget.bind("change", function () {
            if (widget.selectedIndex === -1 && widget.value()) {
                if (widget.dataSource.view().length > 0) {
                    widget.select(0)
                } else {
                    widget.value("");
                }
            }
        })
    });
</script>

@Html.LabelFor(m => m.ParticipantNameSurname)
@(Html.Kendo().ComboBox()
    .Name("participants") //The name of the combobox is mandatory. It specifies the "id" attribute of the widget.
    .DataTextField("NameSurname") //Specifies which property of the Model to be used by the combobox as a text.
    .DataValueField("ID") //Specifies which property of the Model to be used by the combobox as a value.
    .HtmlAttributes(new { style = "width:300px" })
    .Placeholder("Type searching text here...")
    .Filter(FilterType.Contains)
    //.MinLength(3)
    .DataSource(source =>
    {
        source.Read(read =>
        {
            read.Action("GetCascadeParticipants", "Participant")
                .Data("filterParticipants");
        })
        .ServerFiltering(true);
    })
    .Enable(false)
    .AutoBind(false)
    .CascadeFrom("multipliers")
)
@Html.ValidationMessageFor(m => m.ParticipantNameSurname)

<script>
    function filterParticipants() {
        return {
        multipliers: $("#multipliers").val(),
        participantFilter: $("#participants").data("kendoComboBox").input.val()
        };
    }

    $(function () {
    /* Find and select value if exists in Kendo().ComboBox() for preventing from selecting free text entry
    Note: Use this script (inside  $(function () { }); ) on the below of each kendoComboBox "seperately" instead of above of the page or at the same section i.e. below of the same kendoComboBox!!! */
    var widget = $("#participants").data("kendoComboBox");
    widget.bind("change", function () {
        if (widget.selectedIndex === -1 && widget.value()) {
            if (widget.dataSource.view().length > 0) {
                    widget.select(0)
                } else {
                    widget.value("");
                }
            }
        })
    });
</script>





控制器:

public JsonResult GetCascadeMultipliers()
{
    return Json(repository.Multipliers.Where(m => m.Status == 1).Select(m => new { ID = m.ID, InstituteName = m.InstituteName }), JsonRequestBehavior.AllowGet);
}


public JsonResult GetCascadeParticipants(int? multipliers, string participantFilter)
{
    var participants = repository.Participants.AsQueryable();

    if (multipliers != null)
    {
        participants = participants.Where(p => p.MultiplierID == multipliers);
    }

    if (!string.IsNullOrEmpty(participantFilter))
    {
        //participants = participants.Where(p => p.Name.Contains(participantFilter)); //Search for the value containing filter
        participants = participants.Where(p => p.Name.StartsWith(participantFilter)); //Search for the value start with filter
    }

    return Json(participants.Select(p => new { ID = p.ID, NameSurname = p.Name + " " + p.Surname }), JsonRequestBehavior.AllowGet);
}





希望这有助于..

这篇关于在剑道组合框多个过滤器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆