批量更新 Kendo UI Grid 动态更改值

Question

我有这个剑道 ui 网格绑定到一个表。此网格具有激活的批量编辑功能。这意味着我可以直接在网格单元格上更改值并保存它。

我想要完成的是通过每行运行一个循环来更改客户端某些列中显示的值，然后点击保存按钮。

这是我的网格中的内容：

 @(Html.Kendo().Grid<TokenEncrypt.Models.SellerEntity>()
  .Name("grid")

  .Columns(columns =>
  {
      columns.Bound(c => c.Name);
      columns.Bound(c => c.EntityId);
      columns.Bound(c => c.SellerEntityTypeId);
      columns.Bound(c => c.CompanyId);
      columns.Bound(c => c.IsActive);
      columns.Bound(c => c.AwsAccessKeyId);
      columns.Bound(c => c.SecretAccessKey);
  })
  .HtmlAttributes(new { style = "height: 500px;" })
  .Scrollable()      
  .Editable(editable => editable.Mode(GridEditMode.InCell))
  .ToolBar(toolbar =>
  {
       toolbar.Save();
  })


  .DataSource(dataSource => dataSource
      .Ajax()
      .Read(read => read.Action("SellerEntities_Read", "Grid"))
      .Update(update => update.Action("SellerEntities_Ubdate", "Grid"))
      .Batch(true)
      .Model(model =>

      {
          model.Id(c => c.EntityId);
      }
      )

      )

        )

这是我循环中的内容：（我不知道如何删除该值并将新值放入网格单元格中。

 function gridChange() {

    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.read();
    var count = grid.dataSource.total();
    $("#countElement").html('Encrypting ' + count + ' Lines');

    // get data from the grid
    var gridData = $("#grid").data().kendoGrid.dataSource.view();
    var grid = $("#grid").data("kendoGrid");
    // loop rows
    for (i = 0; i < count; i++) {

        str = gridData[i].EntityId;
        EntityIdhash = CryptoJS.SHA256(str);

        // remove old value
        // enter new value

        console.log('EntityId: ' + gridData[i].EntityId + '\n'); 
        console.log('EntityId encrypted: ' + EntityIdhash + '\n'); 

    }

};

Answer 1

您可以执行以下操作（无需查看任何 HTML）：

$('#save').on('click', function () {
    success();
})

function success() {
    var storedValues = [];
    var gridData = $("#grid").data().kendoGrid.dataSource.data();
    for (var i = 0; i < gridData.length; i++) {
        if (gridData[i].EntityId) {
            storedValues.push({
                cellValue: gridData[i].EntityId,
            });
        }
    }
    var inputData = { yourVariable: JSON.stringify(storedValues) };
    $.ajax({
        cache: false,
        type: 'POST',
        url: "/YourController/Here",
        data: inputData
    }).done(function (data) {
       // success here
            $('#grid').data('kendoGrid').refresh();
        }
    });
};