2

所以现在,我可以选择行并上下移动它。这是事件侦听器:

    $(".moveUpPlaylist").click(function () {
        moveSelected("up");
    });

    $(".moveDownPlaylist").click(function () {
        moveSelected("down");
    });

这是实际的功能:

function moveSelected(direction){
        var arr = jQuery('#table_playlist tbody tr.row_selected');

        for(var i=0; i<arr.length; i++) {            
            var tr = arr[i];            
            var row = jQuery(tr);               // row to move.

            var prevRow;
        if(direction === "up")
            prevRow = jQuery(tr).prev();
        else
            prevRow = jQuery(tr).next();

        /* already at the top? */
        if(prevRow.length==0){  break; }    

        moveDataUp(row, prevRow);
        moveVisualSelectionUp(row, prevRow);
    }   
}   

/* the visual stuff that show which rows are selected */
function moveVisualSelectionUp(row, prevRow){
    row.removeClass("row_selected");
    prevRow.addClass("row_selected");
}

/* move the data in the internal datatable structure */
function moveDataUp(row, prevRow){      
    var movedData = _tablePL.fnGetData(row[0]).slice(0);    // copy of row to move.
    var prevData = _tablePL.fnGetData(prevRow[0]).slice(0); // copy of old data to be overwritten by above data.

    // switch data around :)
    _tablePL.fnUpdate(prevData , row[0], 0, false, false);  
    _tablePL.fnUpdate(movedData , prevRow[0], 0, true, true);
}    

所以问题出在我将行向下移动到页面底部时。它只能在表格的同一页内移动。如果它位于页面的底部或顶部,我该如何制作它以便跨页面移动?

4

1 回答 1

5

我确信这对帖子的发起者来说已经过去了,但也许它对其他人有用。我发现从表格中提取数据、相应地更新数组并重新绘制表格更容易。为了为我完成这项工作,我将索引设置为向上/向下按钮上的属性,以将它们绑定到特定行。

$(document).on('click', '.moveup', function(e){
    var index = $(this).attr('index');
    if ((index-1) >= 0) {
        var datatable = $('#datatable.table').dataTable()
        var data = datatable.fnGetData();
        datatable.fnClearTable();
        data.splice((index-1), 0, data.splice(index,1)[0]);
        datatable.fnAddData(data);
    }
});
$(document).on('click', '.movedown', function(e){
    var index = $(this).attr('index');
    if ((index+1) >= 0) {
        var datatable = $('#datatable.table').dataTable()
        var data = datatable.fnGetData();
        datatable.fnClearTable();
        data.splice((index+1), 0, data.splice(index,1)[0]);
        datatable.fnAddData(data);
    }
});

通过重绘整个表格,您不会遇到分页问题

于 2014-01-23T09:56:19.177 回答