Internet Explorer Bug - Scriptaculous Drag And Drop Goes Into Text Select Mode
In some cases when you make an object draggable using Scriptaculous/Prototype as you drag an element the drag might register an ondrag or onselectstart event in Internet Explorer.
To fix this problem when you create your draggable add this to your :
function wedge(event){ return false }
new Draggable(element, {
onStart: function(){
if (document.all){
Event.observe(document.body, "drag", wedge, false);
Event.observe(document.body, "selectstart", wedge, false);
}
},
revert: function(){
if (document.all){
Event.stopObserving(document.body, "drag", wedge, false);
Event.stopObserving(document.body, "selectstart", wedge, false);
}
}
})
I hope this will help others experiencing problems with Internet Explorer’s borked event model.
on March 9th, 2007 at 5:17 pm
Fantastic if I place this funciton in the scriptaculous script file do I have to put anything where I call the draggable function ?
can you post an example?
on March 9th, 2007 at 5:27 pm
nevermind I got it :) didnt quite realize it was to go in the calling draggable function.
Should add this to scriptaculous so it does it automagically with a flag or something
on May 29th, 2007 at 12:11 pm
I had exactly the same problem and you made my day. Thanks!
Should this trick be an integral part of scriptaculous? I think so!
on November 5th, 2007 at 11:05 am
Nice, but where do I put this code? I am using Sortable.create()
on November 5th, 2007 at 11:40 am
Alexander,
You may have to patch prototype directly for Sortable.create. Which version of prototype/scriptaculous are you using? Could you point me to the example online?
on December 28th, 2007 at 4:15 pm
definitely, THANK YOU.
This fixed it up for me in IE 6 and 7. Do you think you could briefly explain whats going on in this function?
on January 16th, 2008 at 6:11 am
hiya, i copied your code in the call to draggable but still getting the same problem in IE6 (don’t know IE7 haven’t tested there yet). here is what i got (no example available i’m afraid cuz i’m testing on localhost - i’m very new to scriptaclous/prototype, can do javascript though…)
function rssBoxes_draggable() {
var aElementsAll = document.getElementById(”chan_items”).getElementsByTagName(”div”);
var sElementsAllLen = aElementsAll.length;
var aElements = [];
for (var i=0;i
on April 22nd, 2008 at 12:12 am
Please forgive me, but I am having no luck placing your code fix. I am trying to get the Scriptaculous shoppingcart example to work in IE7. Would you please point me to where I need to insert? Your help is greatly appreciated. Thank you.