Question

我使用的是剑道版2017.3.913和我的客户端。

我要描述的所有内容都有效......除了最后一点（典型的！）。

我的网格设置为调用我的api返回数据。当数据返回时，我为每条记录添加了一个额外的属性，＃34; IsSelected＆＃34;，因为每行都有一个复选框。然后我将数据绑定到网格并应用我的过滤器（网格上方的四个复选框以允许过滤数据）。

我的网格绑定后，我有一个绑定的绑定事件，根据数据设置每行复选框的状态（禁用等）。这也在数据行之间添加了许多行（绿色） - 就像标题一样，表示下面的行都是相互关联的（所以想象一下绿色行后跟5个白行，然后是一个新的绿色行并说出来3个白色行等）。我以这种方式添加的这些行也有一个复选框 - 当我单击此复选框时，我希望所有相关（白色）行都被选中（＆lt; - 我还没有得到那个远）。

到目前为止一切顺利。

当我对网格进行过滤时，网格会刷新，因此我必须想出一种方法来跟踪已检查的复选框，并在网格刷新后重新设置其状态。以前（即：在不同的页面上）我通过使用数组来存储已经检查了哪些复选框，然后在绑定事件上我将通过数组运行并重新检查相应的复选框 - 这结果是相当的在一些地方很多代码。所以这次我想我尝试使用Observable Array（VM）。

我把所有事情都搞定了 - 数据行（白色）在网格刷新之间保持其复选框状态，这很棒 - 不需要加载DOM工作。但是......

添加标题行（绿色）的代码如下所示;

chkbx.setAttribute("data-bind", "events: { change: CheckBoxClick }");

当然，方法中的代码要多得多，但这是重要的一点（我相信）。这正确呈现为;

<td>
    <input type="checkbox" data-id="196" data-bind="events: { change: CheckBoxClick }">
</td>

我的VM中有一个方法;

CheckBoxClick: function() {
    alert("Hello");
}

但它永远不会被调用，所以我认为VM需要反弹，因为已经添加了新的VM相关内容，但是VM并不知道所以我在网格的绑定事件上重新绑定VM所以;

kendo.bind($("#openTab"), openVM);

不幸的是，那条线导致网格绑定事件中完成的所有工作都被销毁，即：没有标题行（绿色）和（虽然我还没有提到它）背景行颜色（在数据行）被消灭了。基本上我留下了一个普通的网格。动态添加的行（绿色）不存在，以便能够单击其复选框以便能够点击VM中的方法。

我还没有想到为什么绑定VM会以这种方式改变网格。

有人有什么想法吗？

Answer 1

当您在已绑定的DOM元素内动态添加内容时，新内容不会像您观察到的那样受到限制。您需要做的是仅绑定您添加的新内容。在包含整个网格的元素上再次调用kendo绑定是过度的，并且会在您描述时导致不必要的影响。一般来说，如果你想重新绑定一个DOM元素，你首先应该使用kendo.unbind但我离题了。

无论如何，我希望您需要做的就是：

chkbx.setAttribute("data-bind", "events: { change: CheckBoxClick }");
kendo.unbind(chkbx); // Might need to do this, not sure
kendo.bind(chkbx, openVM);

KendoUI Grid - 动态添加row-bind vm

1 个答案: