Kendo Combobox中的多个过滤器

Question

我见过几个例子，其中FilterType.StartsWith或FilterType.Contains用作过滤器。

@(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的列表，然后是基于Contains的列表。所以这就像两个名单的联合。

Answer 1

Selam Hasan。以下是我在项目中使用的所需内容，并且完美运行。它根据所选的“乘数”检索“参与者”。我通过在我的模型上组合Name和Surname来使用NameSurname属性，但是当然只能使用一个属性作为过滤器参数。另一方面，我使用了额外的javascript方法，以防止用户将自由文本输入组合框。

除了我的示例，您还可以查看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);
}

希望这会有所帮助..