Drop-down list not populating

[James]

I've tried replicating the example code from the Autocomplete demo page, but for some reason the GetOccupations function in the controller is never called, nor can I see that the onAdditionalData function in the cshtml is ever called either.  The dropdown control is produced on the page, but it contains no contents.  I have created as valid ModelView.  Please help me identify the disconnect that I am having here. Thanks!

Index.cshtml:

@model IEnumerable<HanleighEnrollment.Global.Models.CaseOccupation>
@using Kendo.Mvc.UI

@{
    /**/

    ViewBag.Title = "Index";
}

<h2>Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>

<div class="demo-section k-content">
    @*<div class="control-label col-md-4">*@
    <h4>Select an Occupation</h4>
    @(Html.Kendo().AutoComplete()
                  .Name("occupations")
                  .DataTextField("Occupation")
                  .Filter("contains")
                  .MinLength(3)
                  .HtmlAttributes(new { style = "width:50%" })
                  .DataSource(source =>
                  {
                      source.Read(read =>
                      {
                          read.Action("GetOccupations", "Test")
                              .Data("onAdditionalData");
                      })
                      .ServerFiltering(true);
                  })
    )
    <div class="demo-hint">Hint: type "war"</div>
</div>
<script>
    function onAdditionalData()
    {
        return
        {
            text: $("#occupations").val()  
        };
    }
</script>
    function onAdditionalData()
    {
        return
        {
            text: $("#occupations").val() 
        };
    }
</script>

 

TestController.cs

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Entity;
using System.Linq;
using System.Net;
using System.Threading.Tasks;
using System.Web;
using System.Web.Mvc;
using HanleighEnrollment.Global.Data;
using HanleighEnrollment.Global.Models;

namespace HanleighEnrollment.Admin.Controllers
{
    public class TestController : Controller
    {
        private EfDbService db = new EfDbService();

        // GET: TestController
        public ActionResult Index()
        {
            return View(db.CaseOccupations.AsEnumerable());
        }

        public JsonResult GetOccupations(string text, int caseId)
        {
            var occupations = db.CaseOccupations.Select(occupation => new Global.Models.ViewModels.CaseOccupationViewModel
            {
                OccupationId = occupation.OccupationId,
                CaseId = occupation.CaseId,
                Occupation = occupation.Occupation,
                JobDuties = occupation.JobDuties
            });

            if (!string.IsNullOrEmpty(text))
            {
                occupations = occupations.Where(p => p.CaseId == caseId && p.Occupation.Contains(text));
            }

            return Json(occupations, JsonRequestBehavior.AllowGet);
         }
    }
}

[Nencho]

Hello, James,

The implementation that you have seems to be correct. Please make sure that the controller and action names are correctly spelled. Other than that - there should be no issue. 

I have also prepared a sample project for you, where I have tested the demonstrated implementation, and everything seems to be working fine - the action in the controller is hit and the. Could you please give it a try at your end, and let me know if I missed something.

Hope this would help.

Regards,
Nencho
Progress Telerik