如何使用Kendo Grid的流畅界面

时间:2014-03-27 15:26:21

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

学习Kendo UI ...我正在玩this tutorial,它很好地展示了如何使用jQuery设置带有服务器端分页的网格。

现在我尝试做同样的事情,除了使用服务器端脚本以便我可以使用漂亮的Fluent界面(似乎剑道的2014-Q1版本没有Intellisense发布 - 请参阅评论{ {3}})。但是我无法让网格发起第一次获取数据的电话。这就是我所拥有的:

<div id="archiveGrid">
@(Html.Kendo()
      .Grid<MessageLite>()
      .Name("archives")
      .Columns(col =>
               {
                   col.Command(m => m.Custom("View").Click("viewClick")).Width(100);
                   col.Bound(m => m.SenderName).Title("Sender").Width(200);
                   col.Bound(m => m.SenderEmail).Title("Email").Width(200);
                   col.Bound(m => m.SentDate).Title("Sent").Format("{dd MMM yyyy HH:mm").Width(150);
                   col.Bound(m => m.Subject);
               })
      .Scrollable()
      .Pageable(pg => pg.PageSizes(true)
          .ButtonCount(10)
          .Input(true)
          .Refresh(true))
      .DataSource(ds => ds
          .Server()
          .PageSize(15)
          .Read(r=>r.Route("defaultApi").Action("","Messages")) // coming unstuck here, I think
          )
)

</div>

我试图调用具有ApiController方法的MessagesController Get()。在我的路线定义中,我有这个:

routes.MapHttpRoute(
    name: "DefaultApi",
    routeTemplate: "api/{controller}/{id}",
    defaults: new { id = RouteParameter.Optional });

...当我使用jQuery语法调用Url api/messages时效果很好,但在使用Fluent语法时它根本不会到达服务器端。< / p>

我错过了什么?

2 个答案:

答案 0 :(得分:1)

尝试将Get添加到.Action(),如下所示:

@(Html.Kendo().Grid<kendouimvcapplication1.models.albummodel>()
    .Name("grid")
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Get", "Albums"))
    )
    .Pageable()
    .Sortable()
    .Filterable()
)

答案 1 :(得分:1)

我建议查看Web Api editing教程,其中介绍了如何将Kendo UI Grid绑定到Web API控制器。