Search code examples
c#asp.net-mvckendo-uikendo-asp.net-mvckendo-autocomplete

AutoComplete control calling controller with null value


I'm trying to use the Kendo UI Autocomplete control with server filtering, but have run into a problem.

While my callback function appears to pull the correct text from the form, it consistently passes a null to the controller method. I can't see any significant way in which my code differs from the sample code. I have verified that the JavaScript is called, and that the desired controller method is being invoked. The latter is simply not receiving the value from the JavaScript method.

What am I missing?

.cshtml source:

@(Html.Kendo().AutoComplete()
    .Name("CustomerIdAutocomplete")
    .DataTextField("CustomerId")
    .MinLength(3)
    .HtmlAttributes(new { style = "width:250px" })
    .DataSource(source => {
        source.Read(read =>
        {
            read.Action("AutocompleteCustomer", "Autocomplete")
                .Data("onAdditionalData");
        })
        .ServerFiltering(true);
    })
)

Javascript:

function onAdditionalData() {
    return {
        text: $("#CustomerIdAutocomplete").val()
    };
}

Controller method:

public ActionResult AutocompleteCustomer(string term)
{
    InformixRepository informixRepository = new InformixRepository();
    IList<AutocompleteCustomer> customers = informixRepository.GetMatchingCustomerIds(term);
    return Json(customers, JsonRequestBehavior.AllowGet);
}

Repository Method:

public IList<AutocompleteCustomer> GetMatchingCustomerIds(string text)
{
    .... content omitted because "text" is already null at this point
}

Solution

  • This should fix it:

    function onAdditionalData() {
        return {
            term: $("#CustomerIdAutocomplete").val()
        };
    }
    

    Whatever you use in the JavaScript needs to be the same as your parameter of your action, which you called term:

    public ActionResult AutocompleteCustomer(string term)
    {
        InformixRepository informixRepository = new InformixRepository();
        IList<AutocompleteCustomer> customers = informixRepository.GetMatchingCustomerIds(term);
        return Json(customers, JsonRequestBehavior.AllowGet);
    }