以声明方式创建 dojox.grid.DataGrid 时 - 如何在字段属性中指定嵌套数据?

2024-02-13

我正在 dojo 1.6 中使用以下符号创建 dojox.grid.DataGrid:

<table dojoType="dojox.grid.DataGrid">
  <thead>
    <tr>
      <th field="id">ID</th>
      <th field="contact.name">Name</th>
      <th field="contact.tel">Telephone</th>
      <th field="contact.birthdate.time">Birthday</th>
    </tr>
  </thead>
</table>

数据看起来像这样:

[{
'id':1,
'contact':{
  'name':'Doh', 
  'firstname':'John',
  'tel':'123-123456',
  'birthdate':{
    'javaClass':'java.sql.Timestamp',
    'time':1234567893434}}
}]

ID 被正确渲染,但所有其他渲染为“...”。 我尝试指定一个格式化程序,将基本对象“联系人”设置为 例如,FIELD,然后返回FIELD.name。 到目前为止,这可以显示正确的值,但是排序然后 使用基础对象。

我认为可能有一种方法可以进一步推动这一点,覆盖排序 表的内容,但我想尽可能简单。

我还希望防止出现性能问题。

有任何想法吗?


我发现 DataGrid 行定义有一个名为“get”的属性。 “get”指定返回要在 DataGrid 列中显示的值的函数的名称。

理论上这应该可以解决我的问题。

get 函数按以下方式实现:

网格定义:

<table dojoType="dojox.grid.DataGrid">
  <thead>
    <tr>
      <th field="id">ID</th>
      <th field="contact" get="myGrid.getContactName">Name</th>
      <th field="contact" get="myGrid.getContactTel">Telephone</th>
      <th field="contact" get="myGrid.getContactBirthdateTime">Birthday</th>
    </tr>
  </thead>
</table>

回调函数(示例):

myGrid.getContactName = function(colIndex,item){
  return item.name;
};

我现在无法判断这个实现是否正确,因为 在我的应用程序中,item 参数始终为空。

这可能是由于使用了新的 Store API (store.Memory) 而不是 ItemFileReadStore,但我还没有成功解决这个难题。

另外,我无法使用这种新方法测试网格排序,所以我不会标记 此解决方案尚未解决。

update

myGrid.getContactName = function(colIndex,record){
  if(record)return record.contact.name;
  else return null;
};

一旦我避免了空情况,它就以这种方式工作得很好。

然而,网格的客户端类型似乎不通过 get 函数访问,而是直接使用该字段。这会阻止对嵌套字段进行正确排序。

update

我终于找到了解决我的问题的方法:

第一个问题:为 DataGrid 字段指定嵌套数据已经使用 get 函数深入到数组子结构中解决了。 (上面已经解释过)

然而排序仍然取决于字段属性。 如果字段属性包含数组名称,则此列将无法正确排序。

我必须修改一些 dojo 类来适应这一点。稍后我会将其以更模块化的形式呈现,但现在这是原始结果:

首先,我需要允许在网格定义中定义附加比较器回调。 为此,我在 dojox.grid.cells._base 中添加了一些代码

dgc._Base.markupFactory = function(node, cellDef){
var d = dojo;
...
var comparator = d.trim(d.attr(node,"comparator")||"");
if(comparator){
  cellDef.comparator = dojo.getObject(comparator);
}
...
}

接下来,DataGrid 需要将这个新参数提供给查询以进行排序。 这是在 dojox.grid.DataGrid 中完成的。 “c”是上面修改的单元格 I。

getSortProps:function(){
...
return[{attribute:c.field,descending:desc,comparator:c.comparator}];
}

最后,我需要更改 dojo.store.util.SimpleQueryEngine 中定义的排序本身。 SimpleQueryEngine 是 MemoryStore (dojo.store.Memory) 的默认引擎。

function execute(array){
    // execute the whole query, first we filter
    var results = dojo.filter(array, query);
    // next we sort
    if(options && options.sort){
        results.sort(function(a, b){
            for(var sort, i=0; sort = options.sort[i]; i++){
                var aValue = a[sort.attribute];
                var bValue = b[sort.attribute];
                if (aValue != bValue) {
                    // changed Part start
                    if(options.sort[i].comparator){ 
                        return !!sort.descending == options.sort[i].comparator(aValue,bValue) ? -1 : 1;
                    }
                    else{
                        return !!sort.descending == aValue > bValue ? -1 : 1;
                    }
                    // changed Part end
                }
            }
            return 0;
        });
    }
    ...
    return results;
}

现在我可以向每列添加比较器并在我想要的位置定义它们:

声明式数据网格设置:

...
<td field="myArray" get="getsNameFromArray" comparator="comparesNames">Name</td>
...

比较器函数的 JavaScript 定义(a 和 b 是“myArray”对象):

compareNames = function(a,b){
  return a.name > b.name;
}

getter 函数的 JavaScript 定义(记录是整行并包含“myArray”对象):

getNamesFromArray= function(idx,record){
  return record.myArray.name;
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

以声明方式创建 dojox.grid.DataGrid 时 - 如何在字段属性中指定嵌套数据? 的相关文章

随机推荐