Question

我在屏幕顶部有6个文本框，可根据任何更改更新整个列（每列一个文本框）。我根据他们的类（.l＃）选择列。这是代码（要遵循的问题）：

function UpdateField() {
  var ctrl = this;
  var id = parseInt(ctrl.id.replace("item", ""), 10) - 1;
  var bound = [".l1", ".l7", ".l8", ".l9"];
  var fields = $(bound[id]);

  for (var i = 0; i < fields.length; i++)
  {
    fields[i].innerHTML = $(ctrl).val();
  }
};

绑定到文本区域的keyup事件。问题是：

1) initially fields.length was -1 as I didn't want to put data in the "add new 
   row" section at the bottom. However, when running it, I noticed the 
   final "real" record wasn't being populated. Also, when stepping through, I
   noticed that the "new row" field was before the "last row" field.
2) when doing it this way, it is purely superficial: if I double click the field,
   the real data hasn't been changed.

所以在宏伟的计划中，我知道我做错了。我假设它涉及更新数据然后强制渲染，但我不确定。

Answer 1

想出怎么做。以这种方式修改了原始代码：

 function UpdateField() {
   var ctrl = this;
   var id = parseInt(ctrl.id.replace("item", ""), 10) - 1;
   var bound = ['title1', 'title2', 'title3', 'title4'];
   var field = bound[id];

  for (var i = 0; i < dataView.getLength(); i++)
  {
      var item = dataView.getItem(i);
      item[field] = $(ctrl).val();
      dataView.updateItem(i, item);
  }
  grid.invalidate();
};

我有6个文本框（item1-item6），它们“绑定”到字段，如果我更改文本框中的数据，它会更新所有行，并且添加的任何新行也都有此数据。

可以用这种方式解释这两个问题的部分：

1）要解决这个问题，尽管它仍然是一个表示性修复，而不是对底层数据的真正更新，但如果它附加了活动类，则可以强制它忽略。额外的工作，而不是一个人想要的“真实”方向（屏蔽该领域）。

2）原始实现非常明显（虽然我可以通过Chrome Dev Tools找出我当时可以修改的内容）它只是更新div的内容而不是实际上与下面的数据交互。看起来不错，如果提交了，可能只需从item1-item6框中取出数据代替列，但如果有人试图修改单元格，他们将再次查看真实数据。

以编程方式更新Slickgrid中的基础数据

1 个答案: