如何通過拖放重新排序kendo行

我想使用kendo的拖放功能重新排序我的行，使用kendo生成行，並且我可以拖動，意味着我能夠抓取一排，但是當我在某處表拖放，行位置不會改變它仍然從中產生行same.code是如何通過拖放重新排序kendo行

@(Html.Kendo().Grid <WorkItemsGrid>().Name("workItemsGrid").Events(e => e.DataBound("onDataBound")) 
    .Columns(c => { 

     c.Bound(i => i.Priority).ClientTemplate("#= GetArrow(Priority)#"); 
     c.Bound(i => i.Order); 
     c.Bound(i => i.EpicTitle).Title("Epic"); 
     c.Bound(i => i.Type).ClientTemplate("#= GetType(Type)#"); 
     c.Bound(i => i.Code).ClientTemplate("#= SetEdit(ItemsId, Code)#"); 

     c.Bound(i => i.Title).ClientTemplate("#= length(Title)#");; 
     c.Bound(i => i.State); 
     c.Bound(i => i.Estimation).ClientTemplate("#= sum(Estimation)#"); 
     c.Bound(i => i.ItemsId).HtmlAttributes(new { 
      @class = "rowId" 
     }).Hidden(); 
    }).Scrollable().Reorderable(x => x.Columns(true)) 
    .DataSource(d => d 
     .Ajax() 
     .Read(r => r.Action("Get", "Items", new { 
      projectId = ViewBag.projectId, selectedSprintId = ViewBag.selectedSprint 
     })) 
    ) 
);

數據綁定的javascrip：

function onDataBound(e) { 

    var grid = this; 
    var currentRecords = grid.dataSource.view(); 
    for (var i = 0; i < currentRecords.length; i++) { 

     if (!currentRecords[i].activeInd) { 
      var row = grid.tbody.find("tr[data-uid='" + currentRecords[i].uid + "']"); 
      row.addClass("item-row"); 

      row.draggable({ 
       cursorAt: { 
        left: 75 
       }, 
       containment: ".grid-view", 
       cursor: "-webkit-grabbing", 
       start: function() { 
        $(this).hide(); 
       }, 
       stop: function() { 
        $(this).show(); 
       }, 
       helper: function() { 
        return $('<div id="' + $(this).find(".rowId").html() + '" class="holder k-grid"><table></table></div>').find('table').append($(this).clone()).end().appendTo('body'); 
       } 
      }); 
     } 
    } 
}

怎樣才能改變通過拖放行來排序？我是劍道的新手，之前由其他開發人員此前已生成

來源

2014-10-01 user3559462

請查看此demo並參考API documentation。您可以將Kendo UI Sortable部件與Kendo UI Grid進行集成。

來源

2014-10-01 19:50:52 Brett

當網格處於內嵌編輯模式時，上面提到的kendo演示會出現問題 - 單擊另一行時單元格的更改會丟失。

這個小提琴http://jsfiddle.net/UsCFK/273/的作品。

它使用一個柱，用如上所述，以防止細胞的編輯丟失的拖動把手 - 其它小區在設置被忽略：

grid.table.kendoSortable({ 
    filter: ">tbody >tr", 
    hint: $.noop, 
    cursor: "move", 
    ignore: "TD, input", 
    placeholder: function (element) { 
     return element.clone().addClass("k-state-hover").css("opacity", 0.65); 
    }, 
    container: '#grid tbody', 
    change: onGridRowChange 
});

它還更新位置字段中的數據源，而不是刪除，然後重新插入該行，如同其他一些示例 - 因爲這將導致對移動的每一行發送刪除請求到服務器 - 這可能會導致點擊批量編輯取消按鈕時出現問題。位置字段僅用於演示目的 - 不應將其暴露給手動編輯。

來源

2016-02-18 13:19:38 lewism

如何通過拖放重新排序kendo行

回答

相關問題