MVC 中的 Kindo Grid 显示原始数据

Question

I'm new to Kendo and learning how to integrate it with MVC and display data in a grid.

My controller

[HttpGet]
public ActionResult StudentList([DataSourceRequest]DataSourceRequest request)
{
    DataSourceResult result = 
    _acc.GetStudent(StudId).ToDataSourceResult(request,
        model => new StudentModel
        {
            ID = model.ID,
            StudId = model.StudId,
            Name= model.Name,
            Email= model.FullName,
            custEmail = model.Email
        });


        return Json(result, JsonRequestBehavior.AllowGet);
}

My view

@(Html.Kendo().Grid<Models.StudentModel>()
                .Name("grid")
                .Columns(columns =>
                {
                    columns.Bound(c => c.StudId);
                    columns.Bound(c => c.Name);
                    columns.Bound(c => c.Email);
                })
                     .Pageable()
                     .Sortable()
                     .Filterable()
                     .Scrollable(scr => scr.Height(550))
                     .DataSource(dataSource => dataSource
                     .Ajax()
                     .Read(read => read.Action("StudList", "Student"))
                     .ServerOperation(false)
  )
)

And the out put I am getting in my browser looks like

{"Data":[{"ID":1102,"StudId":4006,"Name":"Adam Lyon","Email":"alyon@regionofwaterloo.ca",",....,

Does anyone has any idea why the data is not formatted in a grid form?

Answer 1

You will get that behavior if you link directly to the EmployeeList action - that should only be called by the grid. If your view name is say Index , you will need another action:

public ActionResult Index()
{
    return View();
}

Then in code link to that:

@Html.ActionLink("Employee List", "Index", "Employee")

Now the view will load and the Kendo grid will render and then call your EmployeeList action to populate the grid.

See the Kendo sample controller here . It has an action to load the view with the grid, and then CRUD actions the grid will call via AJAX.