2

我使用 RPNiemeyer 的 kendo-knockout 库将我的视图模型与我的 KendoUI 网格绑定。我想做的是订阅网格的更改事件，这样我就可以更新相应的视图模型项。

我将 observableArray 与如下所示的对象绑定：

{
  Address: "Street name"
  ClientNumber: 1337
  NamePartner: "Client name"
  Selected: false
}

现在，我希望在选择相应行时将 Selected 属性设置为 true（KendoUI 网格的更改事件）。为此，我认为我应该使用 Knockoutjs 自定义绑定处理程序。

我发现了这个http://jsfiddle.net/D3rSk/155/，它在做同样的事情。唯一的问题是这个例子在我的控制台中给出了一些错误，它还绑定了一个单独的'selectedItem' observable，而我想将它绑定到我的 observableArray 中的属性。

提前致谢。

4

1 回答 1

5

做你想做的事情并不是完全无缝的，但你可以这样做：

  • change为事件添加处理程序
  • select使用网格的方法获取选定的行元素
  • 从行元素使用网格的dataItem方法获取数据项
  • 此 dataItem 是一个干净的对象，因此请获取其唯一键（在您的情况下为 ClientNumber）并使用它在您的 observableArray 中查找原始项目。

就像是：

<div id="grid" data-bind="kendoGrid: { data: items, sortable: true, selectable: true, change: updateSelected, columns: ['Address', 'ClientNumber', 'NamePartner'], widget: grid }"></div>

使用updateSelected视图模型上的方法，例如：

updateSelected: function() {
    var grid = viewModel.grid(),
        row = grid.select(),
        clientNumber = grid.dataItem(row).ClientNumber,
        actualItem = ko.utils.arrayFirst(viewModel.items(), function(item) {
           return item.ClientNumber === clientNumber;
        });

    if (actualItem) {
        actualItem.Selected = true;

        if (viewModel.previouslySelected) {
            viewModel.previouslySelected.Selected = false;   
        }

        viewModel.previouslySelected = actualItem;
    }            

    return true;
}

示例：http: //jsfiddle.net/rniemeyer/7MXfj/

您可以考虑尝试将此逻辑移动到将添加到绑定旁边的自定义绑定中kendoGrid。

于 2013-03-27T12:45:47.167 回答