如何在Kendoui的datagridview上显示数据?

时间:2013-05-01 09:24:27

标签: asp.net-mvc datagridview kendo-ui

  

如何使用我的dataLayer (DL)?在kendo的 datagridview 上显示数据?     我也查看了telerik kendo的文档,但我发现它令人困惑?

     

当我运行下面的代码时,它只显示列的标题。

查看

  

    @(Html.Kendo().Grid<sampleProj.Model>() // Specify the type of the grid
    .Name("Grid")
    .BindTo((IEnumerable<sampleProj.Model>)ViewBag.Products)
    .Columns(columns =>
    {
        columns.Bound(p => p.FirstName);
        columns.Bound(p => p.LastName);
        columns.Bound(p => p.MName);
        columns.Bound(p => p.Name);
    })
)

更新了错误代码

@(Html.Kendo().Grid((List<MDL.Employee>)ViewData["oEmployees"])  
.Name("Grid")    
.Columns(columns => 
{        
    columns.Bound(p => p.Code).Title("Code");
    columns.Bound(p => p.FirstName).Title("First Name").Width(140);
    columns.Bound(p => p.LastName).Title("Last Name").Width(140);
    columns.Bound(p => p.Position).Title("Position").Width(100);
})

当我添加以下属性时,此错误描述

  

用户代码未处理HttCompileException外部组件抛出异常   当我删除下面的代码时,它显示数据网格视图但没有Action方法

.ToolBar(toolbar => {
        toolbar.Create();
        toolbar.Save();
        toolbar.Custom();      
    })

    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable()
    .Sortable()
    .Scrollable()
    .DataSource(dataSource => dataSource        
       .Ajax()         
       .Batch(true)
       .ServerOperation(false)
       .Events(events => events.Error("error_handler"))
       .Model(model => model.Id(p => p.Code))
       .Read(read => read.Action("dialogEmp_read", "MasterData"))
       .Create(update => update.Action("dialogEmp_Create", "MasterData"))
       .Update(update => update.Action("dialogEmp_Update", "MasterData"))
       .Destroy(update => update.Action("dialogEmp_Destroy", "MasterData"))

    )

1 个答案:

答案 0 :(得分:1)

  

您只需遵循此流程即可完成上述流程   错过了Kendo Grid的读取方法。所以请参阅下面的代码   Cshtml页面

  @(Html.Kendo().Grid<sampleProj.Model.ListWhichYouAreBinding/StoredProcedure/ModelName>()
          .Name("GridName")
          .Columns(columns =>
          {
 columns.Bound(p => p.Name).Title("Name");
 columns.Bound(p => p.Phone).Title("Phone");
 columns.Bound(p => p.OtherValue).Title("Balance").Format({0:c}").HtmlAttributes(new
 {
  style = "text-align:right; padding-right: 11%;"
 });
 columns.Command(command => 
 { command.Destroy(); 
   command.Edit();
         }).Width(150);
        })
        .ToolBar(toolbar => toolbar.Create().Text("Add New"))
        .Editable(editable => editable.Mode(0))
        .Sortable()
        .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model =>
        {
            model.Id(p => p.GivePrimaryKeyFieldNAme);
            model.Field(p => p.GivePrimaryKeyFieldNAme).Editable(false);
        })

        .Create(update => update.Action("CreateRow", "ControllerName"))
       .Read(read => read.Action("GetData", "ControllerName", ))
        .Update(update => update.Action("UpdateRow", "ControllerName"))
      .Destroy(update => update.Action("DeleteRow", "ControllerName"))
         ))
  

现在,在控制器中,您必须为其创建所有上述方法   阅读更新删除创建。   我只会告诉你有关阅读的事。进入你的控制器并执行此操作。   记得   函数的名称应该与

中写的相同
Read(read=>read.action in above)
  

即GetData所以,在控制器中创建一个像这样的函数

[HttpPost]
 public ActionResult GetData ([DataSourceRequest] DataSourceRequest request)
 {
 var YourData=Get Your List Here From Datatbase;
 return Json(YourData.ToDataSourceResult(request));
 }

希望这会对你有用。