kendo-uitelerikkendo-dropdown

Kendo DropDownList not populating


Kendo drop down is empty for some reason and I am not sure, below is all my code

@(Html.Kendo().DropDownList()
      .Name("parties")
      .HtmlAttributes(new { style = "width: 250px" })
      .DataTextField("Name")
      .DataValueField("PartyId")
      .DataSource(source =>
      {
          source.Read(read =>
          {
              read.Action("GetParties", "Concept");
          });
      })
)

Controller Call

public JsonResult GetParties([DataSourceRequest] DataSourceRequest request)
    {
        var parties = MiscAdapter.GetParties().Select(x => new PartyModel
        {
            Name = x.PartyName,
            PartyId = x.PartyId
        });
        return Json(parties.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
    }

Model

public class PartyModel
{
    public int PartyId { get; set; }
    public string Name { get; set; }
}

Data returned according to the F12 tools

{"Data":[{"PartyId":1,"Name":"New Democratic Party"},{"PartyId":2,"Name":"Saskatchewan Party"},{"PartyId":3,"Name":"Liberal"},{"PartyId":4,"Name":"Green"},{"PartyId":5,"Name":"Independant"}],"Total":5,"AggregateResults":null,"Errors":null}

The dropdown does not show anything in there even though i cant see anything with the code or returned data.


Solution

  • Please try with the below code snippet. The method you have used its used for grid data binding.

    public JsonResult GetParties()
    {
        List<PartyModel> models = new List<PartyModel>();
        models.Add(new PartyModel() { Name = "Name1", PartyId = 1 });
        models.Add(new PartyModel() { Name = "Name2", PartyId = 2 });
    
        return Json(models, JsonRequestBehavior.AllowGet);
    }
    

    Let me know if any concern.