Kendo 组合框 onkeypress 事件

Kendo Combo Box onkeypress Event

我在处理组合框上的大数据时遇到了问题,因为它至少 returns 16,000 条记录 我试过这个方法 JsonReturnResult.MaxJsonLength = int.MaxValue; 但是我的浏览器仍然挂起。现在我想要做的是在 User 按下 Enter.

时触发查询

这是我的代码:

<script>
function onSelectCAO() {
                     var AccountName = $("#ChildAccountCode").val();
                     $("#account_name").data("kendoComboBox").value(AccountName);
                     document.getElementById("text_AcccountName").value = AccountName;

                 }
</script>

<input type="text" id="text_AcccountName" name="text_AcccountName" style="width:80%;" hidden="hidden"/>

@(Html.Kendo().ComboBox()

                                .Name("ChildAccountCode")
                                .DataTextField("ChildAccountCode1")
                                .Filter(FilterType.Contains)
                                .MinLength(3)
                                .Placeholder("Select ChildAccountCode")
                                .DataValueField("AccountName1")
                                .HtmlAttributes(new { @style = "width: 200px;" })
                                .Events(e =>
                                    {
                                        e.Change("onSelectCAO");
                                    })
                                                    .DataSource(source =>
                                                                {
                                                                    source.Read(read =>
                                                                        {
                                                                            read.Action("ddlChildAccountCode", "Dropdowns");
                                                                        });
                                                                })                                                                                       
             )

我想要完成的是当用户按下 Enter 它只会 return 根据用户输入的结果

我已经解决了我的问题。所以这是我的解决方案我将 AutoBind 设置为 false 并在我的 DataSource 上设置 参数 作为我的查询 [=14= 的过滤器或条件]

@(Html.Kendo().ComboBox()

                                .Name("ChildAccountCode")
                                .DataTextField("ChildAccountCode")
                                .Filter(FilterType.Contains)
                                .MinLength(3)
                                .Placeholder("Select ChildAccountCode")
                                .DataValueField("AccountName")
                                .HtmlAttributes(new { @style = "width: 200px;" })
                                .AutoBind(false)
                                .Events(e =>
                                    {
                                        e.Change("onSelectCAO");
                                    })
                                                    .DataSource(source =>
                                                                {
                                                                    source.Read(read =>
                                                                        {
                                                                            read.Action("ddlChildAccountCode", "Dropdowns").Data("AccountCodeParameter");
                                                                        });
                                                                })                                                                                       
             )

内部脚本。

$("#DropDownID").data("kendoComboBox").input.keydown(function (e) {
console.log("KeyPressed");
  console.log(e.keyCode);
} 

我强烈建议您通过 Kendo 的 ServerFilteringTrue 属性将数据获取到组合框。 因为16000条记录太高了。

您可以在包含内容的 Kendo 上和业务端使用文本过滤 您可以使用输入到组合框的文本按名称和 ID 进行过滤。

jquery中的过滤方法可以像

function filterByText() {
    var mainText = $("#DropDownID").data("kendoComboBox").input.val();
    return {
        text: mainText
    };
}

和kendo组合框就像

<div class="form-group">
    <label class="col-md-3 control-label">@Html.LabelFor(m => m.SomeModelId)</label>
    <div class="col-md-9">
        @(Html.Kendo().ComboBoxFor(m => m.SomeModelId)
                 .DataTextField("ChildAccountCode")
                 .DataValueField("Id")
                 .HtmlAttributes(new { style = "width: 100%", id = "ChildAccountCode", data_value_primitive = "true", required = "required", validationMessage = "Select code" })
                 .Placeholder("Select some code")
                 .Filter("contains")
                 .AutoBind(true)
                 .Suggest(false)
                 .DataSource(source =>
                 {
                     source.Read(read =>
                     {
                         read.Action("ddlChildAccountCode", "DropDowns").Data("filterByText");
                     })
                     .ServerFiltering(true);
                 }).AutoBind(true)
        )
    </div>
</div>

例如,在您的控制器中,如果文本参数长度小于 3,则您不能向组合框填充任何内容,这样会降低 DB 调用的成本。

希望对你有用