json - Slickgrid - 具有复杂对象的列定义

Question

我有一个 Java 对象，其中 person 对象包含一个 displayName 对象。我已将它转换为我的 JSP 的 JSON 对象。数据如下所示:

var people = [
{"id":52959,"displayName":{"firstName":"Jim","lastName":"Doe","middleName":"A"},"projectId":50003,"grade":"8","statusCode":"A","gradYear":2016,"buyer":false},
{"id":98765,"displayName":{"firstName":"Jane","lastName":"Doe","middleName":"Z"},"projectId":50003,"grade":"8","statusCode":"A","gradYear":2016,"buyer":true}
];

我想将我的列绑定(bind)到位于 displayName 对象中的名称属性，但我无法让列定义识别数据所在的位置。这是我的 firstName 列定义的示例:

{id: 'displayName.firstName', field: 'displayName.firstName', name: 'First Name',
width: 110, sortable: true, editor: TextCellEditor, formatter: SpaceFormatter,              
cssClass: '', maxLength: 250, editable: true}

尽管数据在那里，但 View 不会呈现名称。是否可以将列绑定(bind)到驻留在另一个对象中的对象属性？如果是这样，我做错了什么？

Answer 1

默认情况下，Slickgrid 不支持此功能，但您可以通过向选项对象添加自定义值提取器来解决此问题:

var options = {
  dataItemColumnValueExtractor: function(item, columnDef) {
    var names = columnDef.field.split('.'),
        val   = item[names[0]];

    for (var i = 1; i < names.length; i++) {
      if (val && typeof val == 'object' && names[i] in val) {
        val = val[names[i]];
      } else {
        val = '';
      }
    }

    return val;
  }
}

var grid = new Slick.Grid($("#slickgrid"), data, columns, options);

该代码使用 slickgrid 2.0 进行了测试，并且运行良好。不幸的是，slickgrid 代码似乎有点不一致，编辑器没有考虑到这个选项，所以这个解决方案只有在你不编辑就显示数据时才可用。