Model view controller 后剑道网格值

下面是剑道格网

@(Html.Kendo().Grid<CS.Web.Models.People.GroupDetailModel>()
  .Name("Grid")
  .Events(e => e.DataBound("LineItems_Databound"))
  .HtmlAttributes(new { style = "overflow:hidden;", @class = "normalgrid" })
  .Columns(columns =>
   {
      columns.Bound(p => p.GroupID).Hidden();
      columns.Bound(p => p.GroupName).Title("Group Name").Width(30);
      columns.Bound(p => p.Department).Title("Department Name").Width(30);
      columns.Bound(p => p.IsBlindSettingsEnable).Title("Blind Group")
        .ClientTemplate("<input  type=\"checkbox\" #= IsBlindSettingsEnable ? \"checked=checked\": \"\" # enabled=\"enabled\"  />")
        .Width(30);
      columns.Bound("Department").Title("Remove")
        .ClientTemplate("<a href='javascript:void(0)' Title='Remove'  onclick='return removeUserGroupRelation(+#=GroupID#+);'> <img alt='Remove' src='" + @Url.Content("~/Content/Images/delete_icon.png") + "' /></a>")
        .Width(30);
   })
   .Sortable()
   .Scrollable(scrollable => scrollable.Virtual(false))
   .DataSource(dataSource => dataSource
     .Ajax()
     .Read(read => read.Action("getAssignedGroups", "People")
       .Data("setRoutesValues")
   ) 

   //new { MerchantId = ViewBag.MerchantId, StartDate = Model.StartDate, EndDate = Model.EndDate }
                                )
  .TableHtmlAttributes(new { @class = "grid_1" })
)

在我的剑道网格中有一个复选框列。当我在客户端sied（在浏览器中）选中或取消选中复选框。并通过give javascript$.ajax post进行post时，它不会在客户端浏览器上发布我更改的复选框值，而是显示从服务器端绑定的值

所以，我的问题是，我希望更新后的值发布到服务器上，并在客户端浏览器上进行修改

---

如果您能给我答案，我将非常感激。

我相信这是因为您关注的是数据源的实际价值，而不是网格本身。您的栅格不可编辑。您正在手动将输入放入网格中，这些输入不会影响数据源

您可以采取两种方法来进行此类更新

---

您可以保留网格的设置方式，并仅通过Java脚本处理此更新。 为此，您需要查找所有需要使用JQuery手动更新的数据项

您可以查找该网格中所有选中的复选框，然后手动获取相关数据项。下面是一个简短的示例，演示如何从网格中的行获取数据项

//checkbox is a JQuery object referencing one of your checkboxes
var row = $(checkbox).closest("tr");
var grid = $("#grid").data("kendoGrid");
var data = grid.dataItem(row);

一旦你有了所有相关的数据项，你就可以发布你的更新了。然后，您必须重新加载网格以获取这些项目的更新状态

总的来说，这不是使用剑道网格进行此类更新的首选方法

---

我建议采用第二种方法

这是我将从中提取示例的站点：

首先，您需要使剑道网格可编辑

.editable（editable=>editable.Mode（GridEditMode.InCell））

。您将不再需要添加复选框的自定义模板。当您现在编辑网格时，它将自动添加它们

然后，您需要将数据源设置为具有更新功能，并使您的服务器期望此更新

您的数据源绑定

.DataSource(dataSource => dataSource        
    .Ajax()         
    .Batch(true)        
    .Read("Editing_Read", "Grid")
    .Update("Editing_Update", "Grid")
)

还有你的服务器端代码

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Editing_Update([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<ProductViewModel> products)
    {
        if (products != null && ModelState.IsValid)
        {
            foreach (var product in products)
            {
                productService.Update(product);
            }
        }

        return Json(products.ToDataSourceResult(request, ModelState));
    }

[AcceptVerbs（HttpVerbs.Post）]
公共操作结果编辑\u更新（[DataSourceRequest]DataSourceRequest请求，[Bind（Prefix=“models”）]IEnumerable产品）
{
if（products！=null&&ModelState.IsValid）
{
foreach（产品中的var产品）
{
productService.Update（产品）；
}
}
返回Json（products.ToDataSourceResult（request，ModelState））；
}

---

通过返回此Json对象，网格将自动更新为新值。这是编辑网格的首选方法。

您只需在复选框选中时更新数据源即可：

...
    .ClientTemplate("<input  type=\"checkbox\" #= IsBlindSettingsEnable ? \"checked=checked\": \"\" # enabled=\"enabled\" onclick='setChecked(this)' />")
...


function setChecked(cb) {
    var row = $(cb).closest("tr");
    var item = grid.dataItem(row);
    item.IsBlindSettingsEnable = cb.checked;
}

。。。
.ClientTemplate（“”）
...
功能设置检查（cb）{
var行=$（cb）.最近的（“tr”）；
var item=grid.dataItem（行）；
item.IsBlindSettingsEnable=cb.checked；
}

现在，您的数据源与视图同步

...
    .ClientTemplate("<input  type=\"checkbox\" #= IsBlindSettingsEnable ? \"checked=checked\": \"\" # enabled=\"enabled\" onclick='setChecked(this)' />")
...


function setChecked(cb) {
    var row = $(cb).closest("tr");
    var item = grid.dataItem(row);
    item.IsBlindSettingsEnable = cb.checked;
}