Search code examples
c#asp.net-mvccomboboxkeypresskendo-combobox

Kendo Combo Box onkeypress Event


I'm having a trouble on handling large data on combo box cause it returns at least 16,000 records I tried this method JsonReturnResult.MaxJsonLength = int.MaxValue; but my browser still hangs up. Now what I want to do is to trigger the query when the User presses Enter.

Here's my code :

<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");
                                                                        });
                                                                })                                                                                       
             )

What I want to accomplish is when User presses Enter it will only return results base on what User input it


Solution

  • I already solved my problems. So here's my solution I set the AutoBind into false and set the Parameter on my DataSource as filter or condition on my query

    @(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");
                                                                            });
                                                                    })                                                                                       
                 )