I wasn't able to come up with a solution within the onDataBound event, but I was able to make it work by enumerating each node and adding the drop event to it after binding the data. Like this:
var viewModel = kendo.observable({ isVisible: true, files: kendo.observableHierarchy(jobBookAPI.directoryContents)});kendo.bind($("#example"), viewModel);// Makes sure the dataTransfer information is sent when we handle file dropsjQuery.event.props.push('dataTransfer');var allNodes = $('#example').find(".k-top,.k-mid,.k-bot");for (var i = 0; i < allNodes.length; i++){ $(allNodes[i]).bind('dragenter', function () { $(this).css({ 'box-shadow': 'inset 0px 0px 20px rgba(0, 0, 0, 0.1)', 'border': '4px dashed #bb2b2b' }); return false; }); // Must handle dragover or drop won't fire. $(allNodes[i]).bind('dragover', function () { return false; }); $(allNodes[i]).bind('dragleave', function (e) { $(this).css({ 'box-shadow': 'none', 'border': 'none' }); return false; }); $(allNodes[i]).bind('drop', function (e) { $(this).css({ 'box-shadow': 'none', 'border': 'none' }); if (e.dataTransfer) { var files = e.dataTransfer.files; alert('dropped on item outer'); } return false; });}