Question

我有以下代码将jQuery UI可排序插件应用于ASP.NET页面上的所有表（GridView），不包括每个表中的第一行（标题）：

function pageLoad() {
    $('table').sortable({
        items: 'tr:not(:first)',
        axis: 'y',
        scroll: true,
        start: startDrag, //store start position
        stop: stopDrag    //get end position, update database
    }).disableSelection();

但是，如果有多行（除了标题行），我只想对表格应用sortable，否则拖放功能是多余的。

如何有条件地将上述内容仅应用于具有多个内容行的表格？感谢。

Answer 1

jquery filter()提供了一个解决方案。它允许您使用测试功能过滤一组匹配的元素。因此，以下代码仅将sortable应用于具有多个数据行的表：

function pageLoad() {

    $('table').filter(function () {
                        return $('tr', this).length > 2;
                      })
              .sortable({
                 items: 'tr:not(:first)',
                 axis: 'y',
                 scroll: true,
                 start: startDrag, //store start position
                 stop: stopDrag    //get end position, update database
                 })
              .disableSelection();
}

Answer 2

响应上面的nydcan查询，startDrag方法如下所示：

 function startDrag(event, ui) {
    var startIndex = ui.item.index();
    ui.item.data('startIndex', startIndex);
}

stopDrag方法如下所示：

function stopDrag(event, ui) {
    var startIndex = ui.item.data('startIndex');
    var endIndex = ui.item.index();
    if (startIndex != endIndex) {
        $.ajax({
            type: 'POST',
            url: '<%= ResolveUrl("~/MyPage.aspx/UpdateOrder") %>',
            contentType: 'application/json; charset=utf-8',
            data: "{ 'startIndex':'" + startIndex + "', 'endIndex':'" + endIndex + "'}",
            dataType: 'json',
            success: updateSuccess,
            error: updateError
        });
    }
}

然后我在我的页面上有一个Web方法（VB.NET），如下所示：

<System.Web.Services.WebMethod()>
Public Shared Sub UpdateRulePriority(ByVal startIndex As Integer, ByVal endIndex As Integer)

    'Do stuff

End Sub

希望有所帮助。

如何有条件地将jQuery可排序UI小部件应用于表（ASP.NET GridView）？

2 个答案: