Open sven5 opened 5 years ago
Thanks for this info @sven5. I'll add it to my notes and will have a play around when I get a chance and get back to you if I find anything. I'll leave this issue open to track it.
It is possible by adding a global event handler for the dragstart
event, which bubbles up.
document.addEventListener('dragstart', function(ev) {
if (ev.target.classList.contains('draggable')) {
ev.dataTransfer.setData("text", null);
} else {
console.log('ignoring draggable');
}
});
However, this also triggers a navigation on dragend
to null.com.
Edit: That was fixed using:
document.addEventListener('drop', function(ev) {
ev.preventDefault();
});
@Sebazzz Yes, that would probably do the job. In my tests I was specifically trying to see what I could achieve without using JS. But if you need this to work today then your suggestion could be the solution.
Thanks @Sebazzz for working out this solution. I also tried to get drag&drop working without js. Currently, this seems impossible for FF.
@chrissainty FYI this is now fixed in the latest Blazor / FF. Live demo / test: https://blazorboilerplate.com/drag_and_drop
Hi Chris,
In Firefox we need an additional step to get drag & drop working. FF needs the call to
ev.dataTransfer.setData("text", null)
on dragstart event. Currently, this seems impossible to do with Blazor server-side. I already made some investigation almost one year ago. The main problem seems to be that theondragstart
attribute must be used for Blazor's event handling and can no longer be used for a js call. When calling a JS function through interop and passing theDragEventArgs
from Blazor the methodsetData
cannot be called.However, it would be great if you find another way to get it working.
Regards Sven