검도 그리드 드래그 가능한 행 (검도 템플릿)

Question

템플릿을 사용하여 채워지는 검도 그리드에서 끌어서 놓기 동작을 구현할 것입니다. 검도 그리드로 드래그 가능한 행과 재정렬을 어떻게 달성 할 수 있습니까?

Answer 1

.Orderable() 

작동합니다. 어쩌면 ".Dragable()"시도해 보겠습니다.

Answer 2

내 데모 코드를 따라 실행 해보십시오.

var data = [ 
{ id: 1, text: "text 1", position: 0 }, 
{ id: 2, text: "text 2", position: 1 }, 
{ id: 3, text: "text 3", position: 2 } 
] 

var dataSource = new kendo.data.DataSource({ 
    data: data,   
    schema: { 
     model: { 
      id: "id", 
      fields: { 
       id: { type: "number" }, 
       text: { type: "string" }, 
       position: { type: "number" } 
      } 
     } 
    } 
}); 

var grid = $("#grid").kendoGrid({ 
dataSource: dataSource, 
scrollable: false,  
columns: ["id", "text", "position"]    
}).data("kendoGrid"); 

grid.table.kendoDraggable({ 
filter: "tbody > tr", 
group: "gridGroup", 
hint: function(e) { 
    return $('<div class="k-grid k-widget"><table><tbody><tr>' + e.html() +  '</tr></tbody></table></div>'); 
} 
}); 

grid.table/*.find("tbody > tr")*/.kendoDropTarget({ 
group: "gridGroup", 
drop: function(e) {   
    var target = dataSource.get($(e.draggable.currentTarget).data("id")), 
     dest = $(e.target); 

    if (dest.is("th")) { 
     return; 
    }  
    dest = dataSource.get(dest.parent().data("id")); 

    //not on same item 
    if (target.get("id") !== dest.get("id")) { 
     //reorder the items 
     var tmp = target.get("position"); 
     target.set("position", dest.get("position")); 
     dest.set("position", tmp); 

     dataSource.sort({ field: "position", dir: "asc" }); 
    }     
} 
}); 

Answer 3

이 .Dragable() 를 넣어하지만 당신이 바로 그 장소에 앉아 있는지 확인, 주문이 필요합니다. 예상 결과를 얻지 못할 수도 있고 주문에주의를 기울이지 않아 발생할 수도 있습니다.