javascript - kogrid中的Master/Detail功能

我想在kogrid中实现主/详细功能。这样，当我选择第一个网格表的任何字段时，所有其他详细信息将显示在下一个详细信息网格中。
任何人都没有任何提示如何实现这一点。

最佳答案

创建一个主/明细网格集，您需要使用ko.computed选择/过滤明细。

您需要3个可观察数组和1个计算数组。

var model = {
  parent: ko.observableArray(),
  details: ko.observableArray(),
  selectedParents: ko.observableArray()
};

model.selectedDetails = ko.computed( function() {
  var selectedParent = this.selectedParents()[0];

  if ( !selectedParent ) {
    return [];
  }

  return this.details().filter( function(item) {
    // define filter comparison here
  } );
}, model );

在您的标记中，定义2个koGrids

<div data-bind="koGrid: {
  data: parent,
  multiSelect: false,
  selectedItems: selectParents }"></div>

<div data-bind="koGrid: { data: selectedDetails } "></div>

koGrid将使用零或一个项目填充selectedItems observableArray。计算对象将对第二个网格所绑定的子代执行过滤器。

我已经从breivity中省略了columnDef数据绑定部分。

如果您要针对详细信息数组运行AJAX查询，则对“父” observable使用预订，将selectDetails更改为直接的observableArray并在AJAX回调中设置其内容

有关基本示例，请参见此jsFiddle

关于javascript - kogrid中的Master/Detail功能，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23335090/