我创建了一个Extjs(4.X)网格,其中包含父母和孩子的记录。记录是按排序顺序排列的,其中子级中的记录总是出现在其父级的正下方,如图所示,其中“P”指定一个记录为父级,而“C”指定一条记录为子级。
“May”是Peter的父母,Odin是Thor和Loki的父母,Bruce没有孩子被标记为parent(独立实体)
当我在网格中拖放记录时,我希望只更改父母的排序顺序,同时也带上他们的孩子。我已经进步到了一个程度,我可以只允许父母拖拽,而不允许孩子四处移动。例如,如果我持有记录“May Parker”,那么应该允许它放在记录Loki之后,即父级的最后一个子级,或者放在另一个父级之前的一行,或放在网格中最后一行之后。我已经创建了一个小提琴,适用于以下情况:
1> 只允许移动父记录。
2> 如果遍历的记录是Child,则不允许父级移动。(nodeOver记录是子项)。
3> 如果上面的节点是子节点,但它是最后一行,则允许父节点删除。
<3>无法正常工作,因为无论我将Parent放在最后一行之后还是最后一行之前,nodeOver索引都会为我提供网格的最后一个索引。
我使用了如下覆盖:
Ext.override(Ext.view.DropZone, {
onNodeOver: function(nodeData, source, e, data) {
if (data && data.records && data.records[0]) {
// The check should be better specified, e.g. a
// female with the name 'Malena' would be recognized as male!
//debugger;
console.log(this.view.getStore().data.items[nodeData.rowIndex].data);
console.log(data.records[0].data.type);
// debugger;
console.log(nodeData.rowIndex +" Hello "+this.view.getStore().data.length);
if (data.records[0].data.type.localeCompare('P') != 0 || (
this.view.getStore().data.items[nodeData.rowIndex].data.type.localeCompare(' C') == 0 &&
nodeData.rowIndex != (this.view.getStore().data.length -1 ) ) ) {
return this.dropNotAllowed;
}
}
return this.callOverridden([nodeData, source, e, data]);
},
onContainerOver: function(source, e, data) {
return this.dropNotAllowed;
}
});
以下是我迄今为止取得的进步:https://fiddle.sencha.com/#view/editor&fiddle/3ji3
如果有人能为我指出以下项目的正确方向,我将不胜感激
1> 我如何将父母及其子女合并,以便拖放俱乐部并移动所有俱乐部?
3> 我如何确保父母不能在另一个父母与其子女之间断绝关系?
请忽略为子记录提供的排名,在现实世界中,我打算仅为父记录提供排名,而为子记录的排名将为空。
2条答案
按热度按时间dffbzjpn1#
使用树梢可以更好地实现这一点,例如:https://examples.sencha.com/extjs/6.2.0/examples/kitchensink/#tree-从Ext2.0开始重新排序Works。您可以对任何分支(父级)进行D&D,所有叶子(子级)都将随之移动。
ohfgkhjo2#
下面是网格组标题的一个工作示例。
主要工作是将侦听器添加到
groupmousedown
并更新eventlistener: