DataTable에서 행을 위아래로 이동

Question

그래서 지금은 행을 선택하고 위아래로 이동할 수 있습니다. 실제 기능

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

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

그리고 여기에 있습니다 : : 여기에 이벤트 리스너입니다 I 페이지의 맨 아래 행을 이동할 때

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); 
}  

그래서 문제가있다. 테이블의 동일한 페이지 내에서만 이동할 수 있습니다. 페이지의 맨 아래 또는 맨 위에 있으면 페이지를 가로 질러 이동하게하려면 어떻게해야합니까?

Answer 1

나는 이것이 과거의 게시물 제작자에게 유용하다고 과거에는 확신했지만 다른 사람들에게 유용 할 수도 있습니다. 데이터를 테이블에서 꺼내어 배열을 적절히 업데이트하고 테이블을 다시 그리는 것이 더 쉬웠다. 이 작품이 나를 위해 인덱스를 특정 행에 묶어 업/다운 버튼에 속성으로 설정했다. 당신이 매김에 실행하지 않는 전체 테이블을 다시 그리는으로

$(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); 
    } 
}); 

은 당신이 당신의 html로 코드를 게시하시기 바랍니다 수 ...