Kendo UI MVC - 基本的 ajax 绑定答案

【问题标题】：Kendo UI MVC - basic ajax bindingKendo UI MVC - 基本的 ajax 绑定
【发布时间】：2017-05-31 05:22:04
【问题描述】：

我看到了引用here的例子

所以在我的应用程序中，我尝试以这种方式实现它：

HomeController

public ActionResult About([DataSourceRequest]DataSourceRequest request)
    {
       List<ShortDetail> listSD = new List<ShortDetail>();
       ... fill the list with objects

       var v = listSD.ToDataSourceResult(request, sd => new ShortDetail { firstname = sd.firstname, surname = sd.surname, classname = sd.classname});

           return Json(v, JsonRequestBehavior.AllowGet)
     }

我的模型 ShortDetail

public class ShortDetail 
{
    public string firstname { get; set; }
    public string surname { get; set; }
    public int classid { get; set; }
    public string classname { get; set; }
    public string grade { get; set; }
    public int studentid { get; set; }
    public DateTime birthdate { get; set; }
    public int? indicatorID { get; set; }
    public string indicatorDescription { get; set; }
    public List<ResultMergedWithType> results { get; set; }

}

在我的查看 About.cshtml

 <div class="col-md-12 table-responsive" id="mapsDiv">
   @(Html.Kendo().Grid<KendoExample.Models.ShortDetail>().Name("grid").DataSource(ds => ds.Ajax().Read(read => read.Action("About", "Home"))).Pageable())


</div>

现在我在浏览器中获取原始 json

或者，如果我尝试将模型与视图绑定

关于.cshtml

@model List<KendoExample.Models.ShortDetail>
@using Kendo.Mvc.UI

 <div class="col-md-12 table-responsive" id="mapsDiv">
  @(Html.Kendo().Grid<KendoExample.Models.ShortDetail>().Name("grid").DataSource(ds => ds.Ajax().Read(read => read.Action("About", "Home"))).Pageable())


</div>

HomeController

 public ActionResult About([DataSourceRequest]DataSourceRequest request)
 {
   ...
   return View(listSD);
 }

然后有一个空网格，其中包含模型 shortdetails 中定义的所有列，除了 ResultMergedWithType 属性

【问题讨论】：

您确定您在var v = listSD.ToDataSourceResult(request, sd => new ShortDetail { firstname = sd.firstname, surname = sd.surname, classname = sd.classname}); 中获得值吗？
是的，我在这两种情况下都在获取数据

标签： jquery ajax asp.net-mvc kendo-grid

【解决方案1】：

我认为您可能错过了教程中的一个步骤。您尚未在任何地方声明您的列架构（第 9 步）：

@(Html.Kendo().Grid<KendoExample.Models.ShortDetail>()
    .Name("grid")
    .DataSource(ds => ds.Ajax()
        .Read(read => read.Action("About", "Home")))
    .Columns(columns =>
    {
        columns.Bound(c => c.firstname);
        columns.Bound(c => c.surname); ... 
    }
    .Pageable())

这是将数据绑定到相关列所必需的。

【讨论】：

没有定义列对填充表格没有帮助..试过了

【解决方案2】：

在使用 json 从 return Json(v, JsonRequestBehavior.AllowGet) 到 return Json(v.ToDataSourceResult(request), JsonRequestBehavior.AllowGet); 返回结果时更改代码

为此，您需要添加命名空间using Kendo.Mvc.Extensions;

【讨论】：

嘿 TechVision，如果您看到我上面的代码，我已经在做，并且浏览器只显示原始 json 数据......我错过了什么？

【解决方案3】：

我认为@TechVision 是正确的。我尚未对其进行测试，但您可能错误地使用了该扩展方法。我有类似的设置，代码的唯一区别是：

List<SomeObject> items =  new GetSomeObjects();
return Json(items.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);

如果您在上述更改后仍然收到错误，那么您可能正确使用了扩展方法，我会打开 Web 调试器并查看请求的来源，看看您是否在您的其他地方调用您的控制器方法BeginForm() 或其他地方的代码。

【讨论】：

【解决方案4】：

我找到了我缺少的东西..我们必须在 Grid<..>() 构造函数中指定一个数据源

关于.cshtml

 @(Html.Kendo().Grid<KendoExample.Models.ShortDetail>(Model).Name("grid").DataSource(ds => ds.Ajax().Read(read => read.Action("About", "Home"))).Pageable())

HomeController

 public ActionResult About([DataSourceRequest]DataSourceRequest request)
 {
   ... 
   return View(listSD);
 }

具有讽刺意味的是，剑道支持团队无法帮助我解决这个问题。

干杯！

【讨论】：