MVC Kendo Grid没有显示任何数据

时间:2015-01-23 14:46:43

标签: c# asp.net-mvc-4 kendo-ui kendo-grid

我正在使用Kendo UI Grid服务器端包装器并尝试从我的模型中加载一些数据。网格正在页面上呈现,但没有填充数据。我还没有使用过这个网格,所以我觉得我只是错过了ClientTemplate的东西。我已经查看了剑道文档,但还没有运气好。

这是我的观点:

<div id="dependents">
    <div id="grid">
        @(Html.Kendo().Grid<Enrollment.Models.DependentModel>()
              .Name("grid")
              .DataSource(dataSource => dataSource
                  .Ajax()
                  .Read(read => read.Action("KendoGrid", "Dependents"))
                  .ServerOperation(false)
              )
              .Columns(columns =>
              {
                  columns.Bound(d => d.MaskedSSN).ClientTemplate("<#: MaskedSSN #>").Title("SSN");
                  columns.Bound(d => d.FirstName).ClientTemplate("<#: FirstName #>").Title("First Name");
                  columns.Bound(d => d.LastName).ClientTemplate("<#: LastName #>").Title("Last Name");
                  columns.Bound(d => d.DateOfBirth).ClientTemplate("<#: DateOfBirth #>").Title("Date of Birth");
                  columns.Bound(d => d.Gender).ClientTemplate("<#: Gender #>").Title("Gender");
                  columns.Bound(d => d.DependentTypeId).ClientTemplate("<#: DependentTypeId #>").Title("Type");
              })
              .Pageable()
              .Sortable()
              .HtmlAttributes(new {style = "height: 400px;"})
              )
    </div>

这是我的控制器:

[HttpGet]
    public ActionResult KendoGrid([DataSourceRequest]DataSourceRequest request)
    {
        DataSourceResult result = UnitOfWork.Enrollment.Dependents.ToDataSourceResult(request,
            model => new DependentModel
            {
                SSN = model.SSN,
                FirstName = model.FirstName,
                LastName = model.LastName,
                DateOfBirth = model.DateOfBirth,
                Gender = model.Gender,
                DependentTypeId = model.DependentTypeId
            });
        return View(result);   
    }

有人可以告诉我我失踪了什么,或者我做错了什么?如果您需要更多信息,请告诉我。就像我说的那样,网格在页面上呈现所有正确的列标题,并且应该有一行但不存在数据。它只是说&#34; 没有要显示的项目&#34;在它。

由于

3 个答案:

答案 0 :(得分:5)

(只是为了扩展你之前的答案)

网格在读取默认状态时实际上会发布帖子。运行fiddler时会看到这个。因此,通过使用Http.GET对此进行标记,操作永远不会被调用。除非您已告知读取操作发送获取请求而非发布请求。

尝试将控制器更改为:

public JsonResult KendoGrid([DataSourceRequest]DataSourceRequest request)
{
    DataSourceResult result = UnitOfWork.Enrollment.Dependents.ToDataSourceResult(request,
        model => new DependentModel
        {
            SSN = model.SSN,
            FirstName = model.FirstName,
            LastName = model.LastName,
            DateOfBirth = model.DateOfBirth,
            Gender = model.Gender,
            DependentTypeId = model.DependentTypeId
        });


    return Json(result,JsonRequestBehavior.AllowGet);   
}

注意我已删除了http动词。如果需要,您可以在之后再申请。

答案 1 :(得分:1)

通过查看代码,我假设控制器正在返回一个视图(html + data)。

你可能应该返回JSON。

将您的退货声明更改为。

return Json(result);

return Json(result, JsonRequestBehavior.AllowGet);

答案 2 :(得分:0)

你知道吗? scartag和David Shorthose都是对的。至于我可以解决问题,你应该单独返回视图。

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

然后你尝试为你的网格做ajax调用。

.DataSource(dataSource => dataSource
              .Ajax()
              .Read(read => read.Action("GetKendoGridData", "Dependents"))
              .ServerOperation(false)
          )

[HttpGet]
public ActionResult GetKendoGridData([DataSourceRequest]DataSourceRequest request)
{
    DataSourceResult result = UnitOfWork.Enrollment.Dependents.ToDataSourceResult(request,
        model => new DependentModel
        {
            SSN = model.SSN,
            FirstName = model.FirstName,
            LastName = model.LastName,
            DateOfBirth = model.DateOfBirth,
            Gender = model.Gender,
            DependentTypeId = model.DependentTypeId
        });
    Json(result,JsonRequestBehavior.AllowGet);   
}

那应该有用。或者您可以尝试以下方法。从来没有尝试过,所以我不确定这个;

return View(Json(result, JsonRequestBehavior.AllowGet));