Loading Remote Data in Select2

Question

I am using Select2's Loading Remote Data Functionality.The problem is that data is not getting loaded on the dropdownlist.On keypress remote function is getting called and data is returning properly,but its not showing in dropdownlist.

HTML

<div class=" form-group col-md-4" data-url="@Url.Action("GetStudentWalkInnName")" id="WalkinnName">
 <div>
    <label for="txtEmployee" class=" control-label">
                      Name
    </label>                               
 </div>
  <div>
        <select class="form-control " id="ddlName"></select>
  </div>                    
</div>

Jquery

//REGISTRATION=>INDEX.JS
$(function () {

var ddlNameUrl=$("#WalkinnName").data("url");
$("#ddlName").select2({
    placeholder: "Search for Name",
    minimumInputLength: 1,
    ajax: { // instead of writing the function to execute the request we use Select2's convenient helper
        url: ddlNameUrl,
        type: "POST",
        dataType: 'json',
        data: function (params) {
            return {
                term: params.term, // search term
                page: params.page
            };
        },
        processResults: function (data, params) {

            params.page = params.page || 1;

            return {
                results: data,

            };
        }

    }
});

});

Controller is

 public JsonResult GetStudentWalkInnName(string term)
    {
        try
        {
            var walkInnNameList = _db.StudentWalkInns
                                .Where(s => s.CandidateName.StartsWith(term))
                                .Select(x => new
                                {
                                    Id=x.Id,
                                    Text=x.CandidateName
                                }).ToList();
            return Json(walkInnNameList, JsonRequestBehavior.AllowGet);

        }
        catch (Exception ex)
        {
            return Json("", JsonRequestBehavior.AllowGet);
        }
    }

Any help will be highly appreciated.

Answer 1

According to the documentation, the format if the data should be an array of objects with names id and name i.e. lowercase (not Id and Name).

Change you query to

var walkInnNameList = _db.StudentWalkInns
    .Where(s => s.CandidateName.StartsWith(term))
    .Select(x => new
    {
        id = x.Id,
        text = x.CandidateName
    }); // .ToList() should not be necessary