1

I'm trying to configure kendo autocomplete using their tutorial. The problem is that autocomplete control display objects instead of property value which I set in kendo initialization (see capture):

@(
    Html.Kendo().AutoComplete()
    .Name("products")
    .Placeholder("Find Product...")
    .DataTextField("Name")
    .Template("<span><img src='/Content/Images/default-photo.jpg' " +
    "width='20' height='20' />&nbsp;${data}</span>")
    .DataSource(source =>
    {
        source.Read(read =>
        {
            read.Action("GetProducts", "Search")
            .Data("onAdditionalData");
        })
            .ServerFiltering(true);
    })

)

<script>
    function onAdditionalData() {
        return {
            text: $("#products").val()
        };
    }
</script>

enter image description here

After I click this item the name is showing properly: enter image description here

My action return type is return Json(products, JsonRequestBehavior.AllowGet); where products is ICollection<VmProduct> Whats going on?

Community
  • 1
  • 1
user3818229
  • 1,537
  • 2
  • 21
  • 46
  • The return type of `onAdditionalData`is an object with a protperty named `text`. try to return directly `$("#products").val()` – ADreNaLiNe-DJ Mar 31 '16 at 13:49

1 Answers1

1

You've set the DataTextField but you're overwriting it when you set the Template, because kendo will execute the template instead of getting the field you set. But that's not the problem, the problem is that in your template you're printing the data object, which is.. an object actually. You need to print it's property related to the suggestion text, e.g.:

.Template("<span><img src='/Content/Images/default-photo.jpg' " +
"width='20' height='20' />&nbsp;${data.Name}</span>")

Give it a try and tell us what happens.

DontVoteMeDown
  • 21,122
  • 10
  • 69
  • 105