Kendo Grid Ajax绑定未显示数据

时间:2015-07-29 14:37:03

标签: ajax json kendo-grid kendo-asp.net-mvc kendo-ui-mvc

我在Kendo Grid中显示数据时遇到了一些问题。我的情况是这样的: 我有一个网格,应该显示有关某个项目的任务的信息。只有与该项目相关的任务才会显示在网格上。我正在使用ajax绑定从服务器获取数据。但是,网格不显示任何数据。我很确定Read函数返回正确的结果,我认为格式正确,但显然我错了。以下是我的代码。

以下是我的模型定义:

Public Class TaskViewModel
    Public Property IdTasks As Integer

    Public Property Task As String
    Public Property AssignedToId As Nullable(Of Integer)
    Public Property StartDate As Nullable(Of Date)
    Public Property DueDate As Nullable(Of Date)

    Public Property usersAssignedTo As UserViewModel
    Public Property costChange As CostChangeViewModel
End Class

Public Class CostChangeViewModel
     Public Property Text as String
     Public Property Value as Integer
End Class

Public Class UserViewModel
     Public Property Text as String
     Public Property Value as Integer
End Class

从控制器读取操作

Function Tasks_Read(familyId As Integer) As JsonResult
        'get the customer family that is being viewed on the margin report
        Dim custFamily As CustomerFamilies = (From a In dbLMT.CustomerFamilies Where a.CustomerFamilyId = familyId).Single
        'get a list of tasks related to that customer family
        Dim lstTasks As IQueryable(Of Tasks) = getTaskList(custFamily)
        'create a queryable of the task view model and select only those properties
        Dim lstTaskViewModel As IQueryable(Of TaskViewModel) = (From a In lstTasks Select New TaskViewModel With {.IdTasks = a.IdTasks, .Task = a.Task, .AssignedToId = a.AssignedToId, .usersAssignedTo = New UserViewModel With {.Text = a.usersAssignedTo.FirstName & " " & a.usersAssignedTo.LastName, .Value = a.usersAssignedTo.IdUsers}, .StartDate = a.StartDate, .DueDate = a.DueDate, .costChange = New CostChangeViewModel With {.Text = a.costChange.CostChangeDesc, .Value = a.costChange.CostChangeProjectId}})

        Return Json(lstTaskViewModel, JsonRequestBehavior.AllowGet)
End Function

上面的函数显示它工作正常,lstTaskViewModel包含具有正确属性的正确任务。

我的网格代码如下所示:

@Html.Kendo.Grid(Of TaskViewModel).Name("gridTasks").Columns(Sub(col)
                                                                             col.Bound(Function(p) p.IdTasks).Title("Id")
                                                                             col.Bound(Function(p) p.costChange).Title("Cost Change Project").ClientTemplate("#=costChange.Text#").Width(200)
                                                                             col.Bound(Function(p) p.Task).Title("Task").Width(400)
                                                                             col.Bound(Function(p) p.StartDate).Title("Start Date").Width(100).Format("{0:MM/dd/yyyy}")
                                                                             col.Bound(Function(p) p.DueDate).Title("Due Date").Width(100).Format("{0:MM/dd/yyyy}")
                                                                             col.Bound(Function(p) p.usersAssignedTo).Title("Assigned To").ClientTemplate("#=usersAssignedTo.Text#").Width(100)
                                                                         End Sub).DataSource(Sub(ds)
                                                                                                     ds.Ajax().Read(Sub(rd)
                                                                                                                            rd.Action("Tasks_Read", "Reports").Data("getFamilyId")
                                                                                                                    End Sub).Model(Sub(model)
                                                                                                                                           model.Id(Function(p) p.IdTasks)
                                                                                                                                   End Sub)
                                                                                             End Sub).AutoBind(True)

使用上面的Grid,我成功创建了新任务并显示它们,但是我看不到从 Tasks_Read 传递的任务列表。 (我已经把所有没有读取数据的内容用于测试目的)

使用IE调试器,我得到了 Tasks_Read 返回网格的JSON字符串:

[{"IdTasks":7027,"Task":"this is a test to ensure that creating a task and an issue is possible","AssignedToId":3151,"StartDate":"\/Date(1438056000000)\/","DueDate":"\/Date(1438228800000)\/","usersAssignedTo":{"Text":"Eric Hemphill","Value":3151},"costChange":{"Text":"Change Final Assy AT from 0.82 to 0.73","Value":125}}]

对我而言,似乎JSON结果适合网格中的模型,但网格不显示任何数据。我想我已阅读过每篇有类似问题的帖子,但到目前为止还没有任何工作。

欢迎任何想法。谢谢你的帮助!

1 个答案:

答案 0 :(得分:1)

经过多个小时的尝试后,我想出来了。在控制器的读取功能中,需要传入一个Kendo.mvc.ui.dataSourceRequest对象。该对象从网格发送。然后,在返回Enumerable之前,需要将其转换为Kendo DataSourceResult,然后转换为JSON对象。 (我认为我对对象这个词的使用是错误的,所以不要写任何论文。)无论如何,控制器功能看起来应该是这样的:

Function Tasks_Read(dataRequest as Kendo.Mvc.UI.DataSourceRequest, other param) as JsonResult {
'get your list of tasks and store them in some sort of enumerable
dim lstTasks as IQueryable(of Tasks) = (Get your list)


'convert the enumerable to a dataSourceResult
dim dataResult as Kendo.Mvc.UI.DataSourceResult = lstTasks.ToDataSourceResult(dataRequest)

要使用 ToDataSourceResult 功能,您需要导入kendo.mvc.extensions命名空间。

这篇文章中的所有内容都在他们的文档中,所以它没什么了不起的,我误解了他们的文档。我希望这可以帮助将来的某个人。祝你好运!