将数据从列表绑定到网格控件

时间:2012-09-13 19:04:04

标签: c# asp.net-mvc-3 telerik-grid telerik-mvc

我很难在Telerik Grid控件中显示数据。我在ViewModel中填充了一个列表对象GraphDetail。然后尝试使用Model.GraphDetail将数据绑定到视图中的网格。该项目编译并运行没有错误,网格确实显示但它是空的。如果我单步执行代码,我可以看到GraphDetail正在填充数据。

这是我的ViewModel:

namespace AESSmart.ViewModels
{
    public class ACVoltagesTelerikGraph
    {
        public long InverterID { get; set; }
        public string InverterName { get; set; }
        public double? voltage_ac_a { get; set; }
        public double? voltage_ac_b { get; set; }
        public double? voltage_ac_c { get; set; }
        public DateTime recordTime { get; set; }
    }

    public class GraphsACVoltagesViewModel
    {
        public DateTime startingDate { get; set; }
        public DateTime endingDate { get; set; }

        public string HCSeries { get; set; }
        public List<ACVoltagesTelerikGraph> GraphDetail { set; get; }

        public void setLists()
        {
            //Code to populate InverterGoups and Inverters
        }

        public void setSeries()
        {
            //Code to populate GraphDetail and HCSeries
        }
    }
}

我的视图包含以下代码以显示网格:

@model AESSmart.ViewModels.GraphsACVoltagesViewModel

@(Html.Telerik().Grid(Model.GraphDetail)
    .Name("Grid")
    .DataBinding(dataBinding => dataBinding.Server())
    .Columns(columns =>
    {
        columns.Bound(o => o.InverterID).Title("InverterID").Width(25);
        columns.Bound(o => o.InverterName).Title("InverterName").Width(100);
        columns.Bound(o => o.voltage_ac_a).Title("Phase 1 Volts").Width(75);
        columns.Bound(o => o.voltage_ac_b).Title("Phase 2 Volts").Width(75);
        columns.Bound(o => o.voltage_ac_c).Title("Phase 3 Volts").Width(75);
        columns.Bound(o => o.recordTime).Title("Record Time").Width(150);
    })
    .Groupable()
    .Sortable()
    .Filterable()
    .Pageable(pager => pager.PageSize(3))
)

以下是结果的屏幕截图: enter image description here

从截图中可以看出,网格是空的。 那么,如何将我在ViewModel中的GraphDetail列表正确绑定到网格?

2 个答案:

答案 0 :(得分:4)

我实际上遇到了一个非常类似的问题。我无法根据列表填充图表。为了解决这个问题,我不得不将列表更改为集合。尝试为您的方案使用以下代码:

public virtual ICollection<ACVoltagesTelerikGraph> GraphDetail { set; get; }

此外,您似乎正在将数据构建为ViewModel中较大类的一部分。因此,您的控制器不会专门处理网格正在使用的模型的创建。所以,'服务器绑定'可能不适合你。更不用说,看起来你只是想向用户显示数据而不需要他们根本不需要修改数据。所以我会像这样在客户端进行数据绑定:

@(Html.Telerik().Grid(Model.GraphDetail)
    .Name("Grid")
    .DataBinding(dataBinding => dataBinding
        .Ajax()
        .OperationMode(GridOperationMode.Client)           
    )

答案 1 :(得分:0)

尝试改变这一点:

@(Html.Telerik().Grid(Model.GraphDetail)

.DataBinding(dataBinding => dataBinding.Server())

到此:

@(Html.Telerik().Grid<ACVoltagesTelerikGraph>()

.DataBinding(dataBinding => dataBinding.Ajax().Select("ActionName", "ControllerName"))