如何在剑道网格中手动设置列值

Question

我能够在控制台上设置备注，但是我不知道一旦用户保存更改，如何将备注值设置到网格中。

反正有手动设置值到剑道网格吗？

示例输出

         |Remark         |User Name|Phone Number|Country
 [unable]|username length|ad       |0123456789  |UK
 [enable]|               |admin2   |0123456222  |US
 [enable]|               |admin3   |0123333339  |CN

用户编辑表格后-输出

         |Remark         |User Name|Phone Number|Country
 [enable]|               |admin1   |0123456789  |UK
 [enable]|               |admin2   |0123456222  |US
 [enable]|               |admin3   |0123333339  |CN

该代码段中提供了项目示例。

         |Remark         |User Name|Phone Number|Country
 [unable]|username length|ad       |0123456789  |UK
 [enable]|               |admin2   |0123456222  |US
 [enable]|               |admin3   |0123333339  |CN

         |Remark         |User Name|Phone Number|Country
 [enable]|               |admin1   |0123456789  |UK
 [enable]|               |admin2   |0123456222  |US
 [enable]|               |admin3   |0123333339  |CN

var defaultData = [{
  reason: "",
  userName: "ad",
  phoneNumber: "0123456789",
  country: "UK"
}, {
  reason: "",
  userName: "admin2",
  phoneNumber: "0123456222",
  country: "US"
}, {
  reason: "",
  userName: "admin3",
  phoneNumber: "0123333339",
  country: "CN"
}];
var defaultColumns = [{
  field: "",
  width: "40px",
  template: "<input name='Discontinued' id='remarkCheckBox' class='checkbox' #= (reason.length > 0)? 'disabled=disabled' : ''# type='checkbox' />"
}, {
  field: "reason",
  title: "Remark",
  attributes: {
    style: "color:\\#cc0000"
  }
}, {
  field: "userName",
  title: "User Name"
}, {
  field: "phoneNumber",
  title: "Phone Number"
}, {
  field: "country",
  title: "Country"
}];



var viewModel = kendo.observable({
  onClick: function() {
    loadImportGrid(defaultData, defaultColumns);
  },

});

function loadImportGrid(defaultData, defaultColumns) {
  var grid = $("#grid").kendoGrid({
    columns: defaultColumns,

    dataSource: {
      data: defaultData
    },
    dataBound: function() {
      grid = $("#grid").data("kendoGrid");
      grid.saveChanges();
    },
    saveChanges: function() {
      getRemark();
    },
    toolbar: ["save"],
    selectable: "row",
    scrollable: true,
    sortable: true,
    editable: true
  });

}

function validation(objectList) {
  if (!objectList.userName || objectList.userName.length < 4) {
    invalidRecordFormat = "username length";
    return invalidRecordFormat;
  }

  if (!objectList.country || objectList.country === " ") {
    invalidRecordFormat = "country invalid";
    return invalidRecordFormat;
  }
  invalidRecordFormat = "";
  return invalidRecordFormat;
}


function getRemark() {
  var data = $("#grid").data("kendoGrid").dataSource._data;
  for (var i = 0; i < data.length; i++) {
    console.log(validation(data[i]));
  }
}
kendo.bind($("#importFile"), viewModel);

Answer 1

始终使用set()模型中的方法更改值。不需要refresh()，例如：

var dataItem = $("#grid").data("kendoGrid").dataSource.data()[0];
dataItem.set("reason", "new value");

演示版

Answer 2

基于验证是否正确，这是您可以更新第一列值的方法。

for (var i = 0; i < data.length; i++) {   
    //access record using for loop - here i is value from loop
    var firstItem = $('#grid').data().kendoGrid.dataSource.data()[i];

    //set col reason value value
    firstItem["reason"]="username length"; 

    //refresh the grid
    $('#grid').data('kendoGrid').refresh();  
}    

另一种方法是使用的DataItem集方法 如在本描述的交

dataItem.set（）方法非常慢，因为它每次触发一个事件。即使是列表100也很慢。

要处理较大的更新，请使用

dataItem[field] = value

不利的一面是，不会应用任何脏标记，并且网格将无法反映所做的更改。

$('#grid').data('kendoGrid').refresh();