asp.net mvc-内联编辑在Kendo mvc中不起作用

Question

下面是我的.cshtml

@using Kendo.Mvc.UI
@model IEnumerable<WebApplication1.Models.DemoViewModel>   
@{
    Layout = null;
    ViewBag.Title = "Home Page";
}
<script src="http://code.jquery.com/jquery-1.11.1.js" type="text/javascript"></script>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.2.714/styles/kendo.common-bootstrap.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.2.714/styles/kendo.bootstrap.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.2.714/styles/kendo.default.mobile.min.css" />
<script src="//kendo.cdn.telerik.com/2016.2.714/js/jquery.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.2.714/js/kendo.all.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.2.714/js/kendo.aspnetmvc.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />

<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="PageContentHeading">
                <h3>
                    <span>Select the company to view the document sharing area</span>
                </h3>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            @(Html.Kendo().Grid<WebApplication1.Models.DemoViewModel>()
                  .Name("SiteDetail")
                  .Columns(columns =>
                  {
                      columns.Bound(p => p.name).Title("Name");
                      columns.Bound(p => p.gender).Title("Gender");
                      columns.Bound(p => p.designation).Title("Designation");
                      columns.Bound(p => p.department).Title("Department");
                      columns.Command(command => { command.Edit(); command.Destroy(); }).Width(250).Title("Action");                      
                  })
                  .ToolBar(toolbar =>
                  {
                      toolbar.Template(@<text>
                <div class="toolbar">
                    <div class="row">
                        <div class="col-md-4" style="float:right;">
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></span>
                                <input type="text" class="form-control" id='FieldFilter' placeholder="Search by Company Details">
                            </div>
                        </div>
                    </div>
                </div>
                    </text>);
                  })
                              .Navigatable()
                              .Pageable()
                              .Editable(editable => editable.Mode(GridEditMode.InLine))
                              .Sortable()
                              .Filterable()
                              .Resizable(resize => resize.Columns(true))
                              .Scrollable()
                              .DataSource(dataSource => dataSource // Configure the grid data source
                              .Ajax()
                              .PageSize(10)                             
                              .Read(read => read.Action("EditingInline_Read", "Home"))
                              .Update(update => update.Action("EditingInline_Update", "Home"))
                              .Destroy(destroy=> destroy.Action("EditingInline_Destroy", "Home")
                              .Model(model =>{ model.Id(x => x.id);})                             
                               )
            )
        </div>
    </div>
    </div>

下面是我的控制器

public ActionResult EditingInline_Read([DataSourceRequest]DataSourceRequest request)
{
    List<TestDemo> _tst = new List<TestDemo>();
    _tst.Add(new TestDemo { name = "ddd", gender = "ffs", designation = "ff", department = "fdf" });
    _tst.Add(new TestDemo { name = "ddd1", gender = "ffs1", designation = "ff1", department = "fdf1" });
    DemoViewModel model = new DemoViewModel();
    model.Testlist = _tst.AsEnumerable().Select(x => x);
    DataSourceResult result = model.Testlist.ToDataSourceResult(request);
    return Json(result, JsonRequestBehavior.AllowGet);
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult EditingInline_Update([DataSourceRequest] DataSourceRequest request, DemoViewModel product)
{
    if (product != null && ModelState.IsValid)
    {
        //productService.Update(product);
    }            
    return Json(new[] { product }.ToDataSourceResult(request, ModelState));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult EditingInline_Destroy([DataSourceRequest] DataSourceRequest request, DemoViewModel product)
{
    if (product != null)
    {
        //productService.Destroy(product);
    }
    return Json(new[] { product }.ToDataSourceResult(request, ModelState));
}

EditingInline_Read正被调试器命中，但Update和Destroy未被调试器命中。有人能提出在剑道网格中更新和删除的方法吗。我也看到了删除[AcceptVerbs(HttpVerbs.Post)]的变通方法，但这对我来说仍然不起作用。

Answer 1

我的观察结果：

EditingInline_Read() -> DataSourceResult result = model.Testlist.ToDataSourceResult(request);

以上代码将转换List<TestDemo>作为结果，而不是DemoViewModel。请调试此代码并检查结果。

在使用DemoViewModel的视图中：@(Html.Kendo().Grid<WebApplication1.Models.DemoViewModel>()

而且您仍然拥有正确的列绑定！

columns.Bound(p => p.name).Title("Name"); columns.Bound(p => p.gender).Title("Gender") .....

所以我认为名字、性别也可以在DemoViewModel中找到。

GridView将at列表(DataSource(中的每个对象显示为行。并仅对单个对象调用Update和destroy方法。

可能的解决方案：

将GridView的绑定更改为TestDemo。

更改接受TestDemo类型对象的Update和Destroy方法。

我希望这个能帮助你。