jqGrid是否具有行交换功能？

我想知道jqGrid是否有内置的“行交换”功能

有时我会在网上找它，但到目前为止运气不好

但类似的功能也存在（并且没有一个可以毫无问题地用于行交换）；DnD和可排序行

sortableRows只会更改行的顺序，无法直观地为用户实现交换

在DnD中，为了使其发挥最佳效果，需要将目标分配给另一个HTML元素或另一个jqGrid。但是，如果您将其设置为相同的jqGrid（以模拟行交换），它将不允许这样做

---

提前感谢。

通常使用按某列排序的网格。在这种情况下，行的重新排序或交换没有意义。如果有未排序的网格并且需要交换行，则可以尝试使用方法从网格中删除临时行，然后使用，或者在新位置插入分离的行

已更新：演示网格中的使用。它有ID为“10”、“20”、“30”、“40”的行

我在演示中包括了两个按钮（id=“move”和id=“swap”）。第一个按钮执行简单的无条件工作：它分离id=“10”的行，并将其放置在id=“40”的行之前

第二个按钮使用

insertAfter

或

insertBefore

方法交换ID为“10”和“20”的行。由于网格中两行的位置不同，无法使用该方法中的一行。此外，如果ID为“10”和“20”的行是一行接一行，则只需移动一行。我试图考虑所有的情况。您将在下面看到相应的代码。我认为可以编写更优化的代码，但我在下面包含的代码似乎仍然可以正常工作：

$（“#移动”）。按钮（）。单击（函数（）{
var$row=$（“#10”）.detach（）；
$row.insertBefore（#40“）；
$（此）.button（“禁用”）；
});
$（“#交换”）。按钮（）。单击（函数（）{
变量$row1=$（“#10”），$row2=$（“#20”），
$next1=$row1.next（.jqgrow”），$prev1=$row1.prev（.jqgrow”），
$next2，$prev2，doOneMove=false，movedOnce=false；
if（$row2.is（$next1）|$prev1.is（$row2））{
杜内莫夫=真；
}
如果（$prev1.length>0&！$prev1.is（$row2））{
$row2.detach（）.insertAfter（$prev1）；
movedOnce=true；
}else if（$next1.length>0&！$next1.is（$row2））{
$row2.detach（）.insertBefore（$next1）；
movedOnce=true；
}
如果（doOneMove&movedOnce）{
返回；
}
$next2=$row2.next（）；
$prev2=$row2.prev（）；
如果（$prev2.length>0&！$prev2.is（$row1））{
$row1.detach（）.insertAfter（$prev2）；
}else if（$next2.length>0&！$next2.is（$row1））{
$row1.detach（）.insertBefore（$next2）；
}
});

我希望这就是您想要的：

代码：

---

如果您只关心交换相邻行，那么下面的代码将起作用。基本上，它将向上或向下移动当前行

function moveCurrentRowJQGrid(grid, moveUP) {
    var key = grid.jqGrid('getGridParam', 'selrow');
    if (!key) return;
    var row = $('#'+ key);
    if (moveUP) {
        var prev = row.prev('.jqgrow');
        if (prev.length > 0) {
            row.detach().insertBefore(prev);
            return 1;
        }
    }
    else {
        var next = row.next('.jqgrow');
        if (next.length > 0) {
            row.detach().insertAfter(next);
            return 1;
        }
    }
}

---

如果成功，它将返回1；如果失败，它将返回未定义（例如，您尝试向上移动第一行）。

这没关系，但我真正想要的是能够在同一网格中使用jqGrid的拖放功能。以及复制拖动行的内容，而不从网格中删除原始行。基本上，DnD位于同一网格上，并且能够将第一行拖动到最后一行。目前我不能这样做。支持将第一行拖动到最后一行以外的行，我可以做到这一点。唯一的问题是拖到最后row@myuce：gridDnD仅在内部使用

addRowData

和

delRowData

sortableRows

在内部使用jQuery UI，它使用我建议您使用的

.detach

。我创建了演示，演示了我的建议。请参阅我答案的更新部分。我在网格菜单中添加了一个项，并按照您的建议实施。但是如果gridDnD的可视性和鼠标拖放行，那就太好了。谢谢。@Johnhnckel:谢谢！我认为您正在编写，但需要更改两行：

}else if（！$next1.is（$row2））{

到

}else if（next1.length>0&！$next1.is（$row2））{

和

}else if（！$next2.is（$row1））{

到

}else if（next2.length>0&！$next2.is（$row1））{

。我只想在我的代码中展示实现的主要思想。我可以想象，还有更多的特殊情况需要测试。我现在更新了答案的代码。@JohnHenckel:对不起，但我不确定你的问题是什么以及我能如何帮助你。我修复了代码和我发布的演示。你可以将代码用作电子邮件示例和重写符合您的目的。我不建议您使用和全局函数（

swapTwoTableRows

和

moveCurrentRowJQGrid

将在和外部函数之外定义），您应该将JavaScript窗口的“加载类型”属性从“onLoad”更改为“no wrap-in”例如，如果要在内部使用

$（document）.ready（function（）{…}）；

。

function moveCurrentRowJQGrid(grid, moveUP) {
    var key = grid.jqGrid('getGridParam', 'selrow');
    if (!key) return;
    var row = $('#'+ key);
    if (moveUP) {
        var prev = row.prev('.jqgrow');
        if (prev.length > 0) {
            row.detach().insertBefore(prev);
            return 1;
        }
    }
    else {
        var next = row.next('.jqgrow');
        if (next.length > 0) {
            row.detach().insertAfter(next);
            return 1;
        }
    }
}