Implementing Drag and Drop in ASP.NET

[Alvin K]

Hello. Would like to hear your thoughts on implementing drag and drop
in ASP.net without resorting to active x or hosting windows controls
in a Web Form.

Is this possible? I realize that this solution would require extensive
client-side DHTML to accomplish, but is there anything out there or
anything that ASP.Net provides out of the box to help facilitate this
task.

Thanks for your feedback.

 

[Alvin Bruney]

This would have to be implemented using scripting. Basically, the idea is,
you will wrap the draggable component in a div tag. Then, since javascript
doesn't support drag and drop, you will have to hack the mouse click,
mousedown and mouse up events. Label8 and 9 are label server controls with
other controls like text boxes and drop downs embedded in them

<script>
retval = (document.all) ? 0 : 1;
var ob;
function MouseDown(e) {
if (retval) {
ob = document.layers[e.target.name];
X=e.x;
Y=e.y;

return false;
}
else
{
if("Label9" == event.srcElement.id || "Label8" == event.srcElement.id)
{
if("Label8" == event.srcElement.id)
{
//position the moving image so it doesn't appear jumpy
ob = event.srcElement.parentElement.style;
X=event.offsetX+125;
Y=event.offsetY-10;
}
else
{
//position the moving image so it doesn't appear jumpy
ob = event.srcElement.parentElement.style;
X=event.offsetX-133;
Y=event.offsetY-14;
}
}
else
ob = null;
}
}
function MouseMove(e) {
if (ob) {
if (retval) {
ob.moveTo((e.pageX-X), (e.pageY-Y));
}
else {
ob.pixelLeft = event.clientX-X + document.body.scrollLeft;
ob.pixelTop = event.clientY-Y + document.body.scrollTop;

return false;
}
}
}
function MouseUp() {
ob = null;
}

if (retval) {
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE |
Event.MOUSEUP);
}

document.onmousedown = MouseDown;
document.onmousemove = MouseMove;
document.onmouseup = MouseUp;
</script>

the important part is to wrap the label8 and 9 in a div tag.