AutoComplete not displaying anything

2 posts, 0 answers
  1. Scott
    Scott avatar
    10 posts
    Member since:
    Aug 2012

    Posted 20 Nov 2012 Link to this post

    I have the following .chtml, view model, and controller actions.  However, the auto complete never displays any results even though I can see that the Jason results are sent back to the browser. 

    .chtml
    @model IEnumerable<Trishulla.Erp.Web.Core.Main.Models.CustomerNameModel>
    @{
        ViewBag.Title = "New Appointment";
    }
    <section class="contentTile">
            New Appointment
    </section>
    @section navigation{
            @Html.Partial("_DailyServiceLeftNav")
    }


    @(Html.Kendo().AutoComplete()
              .Name("CustomersAutoComplete")
              .BindTo(Model)
              .Suggest(true)
              .DataTextField("Name")          
              .Filter(FilterType.StartsWith)
              .Placeholder("Customers...")
              .DataSource(source =>
                              {                              
                                  source.Read(read =>
                                                  {
                                                      read.Action("GetActiveCustomers", "DailyService");
                                                  }).ServerFiltering(true);
                              })                                 
    )


    View Model:
    public class CustomerNameModel
        {
            public int Id { get; set; }
            public string Name { get; set; }
    }

    Controller actions:
     public ActionResult NewAppointment()
            {
                IEnumerable<CustomerNameModel> customerModel = this.customerService.CustomerRepository.GetMany(c => c.IsActive)
                                                .Select(c => new CustomerNameModel
                                                {
                                                    Id = c.Id,
                                                    Name = string.Format("{0} {1}", c.FirstName, c.LastName)                                               
                                                });


                return View(customerModel.ToList());
            }


            [HttpGet]
            public ActionResult GetActiveCustomers([DataSourceRequest] DataSourceRequest request)
            {
                string searchValue = Request.Params["filter[filters][0][value]"];
                IEnumerable<CustomerNameModel> customerModel = this.customerService.CustomerRepository.GetMany(c => c.IsActive)
                                                .Select(c => new CustomerNameModel
                                                {
                                                    Id = c.Id,
                                                    Name = string.Format("{0} {1}", c.FirstName, c.LastName)
                                                });


                var returnVal = Json(customerModel.Where(c => c.Name.StartsWith(searchValue, StringComparison.InvariantCultureIgnoreCase)).ToList().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
                return returnVal;
            }
  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 21 Nov 2012 Link to this post

    Hello Scott,

     
    The ToDataSourceResult extension method will return the filtered cutomerModel list using a specific schema:

    { Data: [list of data], Total: number }
    This in general is required for the Grid widget. The AutoComplete in your code snippet on the other hand expects the JSON to be a simple array of objects. Here is the correct return:
    var returnVal = Json(customerModel.Where(c => c.Name.StartsWith(searchValue, StringComparison.InvariantCultureIgnoreCase)).ToList(), JsonRequestBehavior.AllowGet);
    Regards,
    Georgi Krustev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top