无法在MVC中绑定Kendo ListView

Question

I am trying to bind Kendo Listview in my MVC 4.0 project, but I am unable to bind the Listview. There is no error but The listview div is shown to be empty. I do not know where the things have gone wrong.Below is my code:

View Page

@{
    ViewBag.Title = "Courses";
}
@using Kendo.Mvc.UI
@model K_SampleProject.Models.CourseModel

<h2>Courses</h2>
<div class="bodywrap">
    <div class="CommonClass" style="padding-bottom: 3%;"><a href="/Home/Registration">Back</a></div>
    <div class="CommonClass">
        @( Html.Kendo().ListView(Model.CourseList)
          .Name("listView")
          .TagName("div")
          .ClientTemplateId("template")
          .DataSource(datasource => datasource
          .Model(model =>
          {
              //The unique identifier (primary key) of the model is the ProductID property
              model.Id(p => p.pkCourseId);

              // Declare a model field and optionally specify its default value (used when a new model instance is created)
              model.Field(p => p.CourseName).DefaultValue("N/A");

              // Declare a model field and make it readonly
              model.Field(p => p.Fee).Editable(false);
          })
)
    .Pageable()
         )
    </div>
</div>

<script type="text/x-kendo-tmpl" id="template">
    <div class="product">
        <h3>#:CourseName#</h3>
        <p>#:kendo.toString(Fee, "c")#</p>
    </div>
</script>

Model

public class CourseModel
{
    public List<CourseListModel> CourseList { get; set; }
    public int? CourseID { get; set; }
    public string CourseName { get; set; }
    public int? FEE { get; set; }
}

Below is my Registration Service:

public class RegistrationService
{
    public List<CourseListModel> GetCourseDetail()
    {
        using (testEntities objContext = new testEntities())
        {
            return objContext.tbl_Courses.Select(p => new CourseListModel
            {
                CourseName = p.CourseName,
                Fee = p.Fee,
                pkCourseId = p.pkCourseId
            }).ToList();
        }
    }
}

Controller

  public ActionResult Courses()
  {
      RegistrationService ObjService = new RegistrationService();
      CourseModel Model = new CourseModel();
      Model.CourseList = ObjService.GetCourseDetail();
      return View(Model);
  }

I have already binded the list view with Model.CouseList which is filled when the page loads.So,is it also necessary to give READ Event in the datasource as shown in documentation of kendo ListView demo and Also this Link .

I'm totally confused with it's binding. I have checked the template also but it is same as it is in kendo documentation

Answer 1

Kendo ListView's require you to return a DataSourceResult. So add a Read() to the datasource in your listView and have it call this action:

public ActionResult GetCourses([DataSourceRequest] DataSourceRequest request)
{
    RegistrationService ObjService = new RegistrationService();
    return ObjService.GetCourseDetail().ToDataSourceResult(request);
}