or
$('#userKriGrid tbody tr').off("click", '**');mainGrid.table.kendoDestroy()<span id="userKriGrid" kendo-grid="vm.userKriGrid"k-data-source="vm.kriUserGridDS"k-options="vm.userKriGridOptions"k-rebind="vm.userKriGridOptions"></span>function addDragDropKRIGridRow() { var mainGrid = $("#userKriGrid").data("kendoGrid"); var mainDataSource = vm.kriUserGridDS; var selectedClass = 'k-state-selected'; $.fn.reverse = [].reverse; //save a new function from Array.reverse $(document).on('click', '#userKriGrid tbody tr', function (e) { if (e.ctrlKey || e.metaKey) { $(this).toggleClass(selectedClass); } else { $(this).addClass(selectedClass).siblings().removeClass(selectedClass); } }); mainGrid.table.kendoDraggable({ filter: "tbody tr", group: "gridGroup", axis: "y", hint: function (item) { var helper = $('<div class="k-grid k-widget drag-helper"/>'); if (!item.hasClass(selectedClass)) { item.addClass(selectedClass).siblings().removeClass(selectedClass); } var elements = item.parent().children('.' + selectedClass).clone(); item.data('multidrag', elements).siblings('.' + selectedClass).remove(); return helper.append(elements); } }); mainGrid.table.kendoDropTarget({ group: "gridGroup", drop: function (e) { var draggedRows = e.draggable.hint.find("tr"); e.draggable.hint.hide(); var dropLocation = $(document.elementFromPoint(e.clientX, e.clientY)), dropGridRecord = mainDataSource.getByUid(dropLocation.parent().attr("data-uid")) if (dropLocation.is("th")) { return; } var beginningRangePosition = mainDataSource.indexOf(dropGridRecord),//beginning of the range of dropped row(s) rangeLimit = mainDataSource.indexOf(mainDataSource.getByUid(draggedRows.first().attr("data-uid")));//start of the range of where the rows were dragged from //if dragging up, get the end of the range instead of the start if (rangeLimit > beginningRangePosition) { draggedRows.reverse();//reverse the records so that as they are being placed, they come out in the correct order } //assign new spot in the main grid to each dragged row draggedRows.each(function () { var thisUid = $(this).attr("data-uid"), itemToMove = mainDataSource.getByUid(thisUid); mainDataSource.remove(itemToMove); mainDataSource.insert(beginningRangePosition, itemToMove); }); //set the main grid moved rows to be dirty draggedRows.each(function () { var thisUid = $(this).attr("data-uid"); mainDataSource.getByUid(thisUid).set("dirty", true); }); //remark things as visibly dirty var dirtyItems = $.grep(mainDataSource.view(), function (e) { return e.dirty === true; }); for (var a = 0; a < dirtyItems.length; a++) { var thisItem = dirtyItems[a]; mainGrid.tbody.find("tr[data-uid='" + thisItem.get("uid") + "']").find("td:eq(0)").addClass("k-dirty-cell"); mainGrid.tbody.find("tr[data-uid='" + thisItem.get("uid") + "']").find("td:eq(0)").prepend('<span class="k-dirty"></span>') }; } }); }
