Hello,
I am having the following drag and drop scenario, which works under Chrome, but not with IE (11 or 10). I have an angular directive which consists of grid with single selection. In the link function, when the grid is populated with data, I convert it to kendoDraggable element via the following code:
function
addDragDropTagSearchGrid() {
scope.tagSearchGrid.table.kendoDraggable({
filter:
"tbody > tr.k-state-selected"
,
cursorOffset: { top: 10, left: 10 },
hint:
function
(e) {
item = $(
'<div class="k-grid k-widget" style="background-color: lightblue; color: black;"><table><tbody><tr>Tag: '
+ e.data().$scope.dataItem.tag +
'/s</tr></tbody></table></div>'
);
return
item;
},
dragend:
function
(e) {
scope.tagSearchGrid.clearSelection();
}
});
}
In my main application, I have a div marked with id="dropArea", and when all of the html is rendered, I convert it to drop area via the following code:
vm.addDropToChartSeries =
function
() {
$(
"#dropArea"
).kendoDropTarget({
drop:
function
(e) {
vm.updateChart();
}
});
};
Everything works as expected, using Chrome. But after testing it with any version of IE, I end up with the following error when I select a row from the draggable grid and start to drag it:
SCRIPT65535: Invalid calling object
File: jquery.js, Line: 3099, Column: 5
But this happens only the first time after the page is refreshed. If I try to drag another row the following problem appears:
SCRIPT5007: Unable to get property 'ownerDocument' of undefined or null reference
File: jquery.js, Line: 1430, Column: 2
I am using jquery v2.1.4 & Kendo UI v2015.3.930.
Any help will be much appreciated!