Telerik RadTreeView Drag N Drop Nodes
What's the best way to override the default text and create a "Visual Cue" when Dragging a RadTreeView Node to another. I've started by:
...
telerik:RadTreeView OnClientNodeDragging="ClientNodeDragging"
...
function ClientNodeDragging(sender, args)
{
if (!visualClue)
{
visualClue = createVisualClue();
document.body.insertBefore(visualClue, document.body.firstChild);
}
visualClue.style.left = args._domEvent.screenX + "px";
visualClue.style.top = args._domEvent.screenY + "px";
}
Is the way to go about displaying the text on screen?
At the moment it's approx 20 px below the draggable node and the existing drag text (RadTreeView) still displays (displays the name of the node text - I want it removed or overridden/hidden).
开发者_StackOverflowUPDATE
OK I've used args._domEvent.clientX
and .clientY
now. Close, but now I need a way of removing the RadTreevIew's own text.
I Managed to sort it out by using IE's debugger (could have used any other debugger) and noticed the sender has this _draggingClue - BINGO!! So all that was left was to style it like this:
function ClientNodeDragging(sender, args)
{
var node = args.get_node();
if (node.get_level() != 0)
{
var dom = args.get_domEvent();
var div = sender._draggingClue;
var moveCopyText = "Copy";
var hidden = document.getElementById("<%= MoveCopyHiddenField.ClientID %>");
if (dom.shiftKey) {
hidden.value = "true";
moveCopy = true;
}
else if (dom.ctrlKey) {
hidden.value = "false";
moveCopy = false;
}
else {
hidden.value = "true";
moveCopy = true;
}
if(moveCopy)
moveCopyText = "Move";
else
moveCopyText = "Copy";
div.className = "DragFile";
div.style.height = '15px';
div.style.paddingTop = '3px';
div.innerHTML = moveCopyText + " " + node.get_text();
}
}
Hope this helps someone and perhaps myself in so many years time ;)
精彩评论