Hello, The attached file works fine with firefox, but fails misearably with IE6 - tested via Wine under Linux. I''m encountering a similar problem in an application of mine in which a container gets replaced. If it''s of any use at all, the ugly IE window says the error is on line 364, character 5, error is ''object required''. Any help or ideas would be welcome... Thankyou, -- David N. Welton - http://www.dedasys.com/davidw/ Linux, Open Source Consulting - http://www.dedasys.com/ --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
> The attached file works fine with firefox, but fails misearably with > IE6 - tested via Wine under Linux. I''m encountering a similar problem > in an application of mine in which a container gets replaced. > > If it''s of any use at all, the ugly IE window says the error is on > line 364, character 5, error is ''object required''.Looks like it''s a known issue:-( http://dev.rubyonrails.org/ticket/5703 -- David N. Welton - http://www.dedasys.com/davidw/ Linux, Open Source Consulting - http://www.dedasys.com/ --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type"> </head> <body bgcolor="#ffffff" text="#000000"> I don''t know what you''re trying to accomplish with this, but you are overwriting the innerHTML of one node with that of another than contains an id declaration, so for one thing you no longer have unique ids in your DOM. IE has different behavior than FF with respect to non-unique ids so this is probably your problem.. Anyway, using script tags inside of a div and calling Element.update with the innerHTML to recreate the draggable is not a good idea. You should rethink what you are trying to do exactly.. If you want to replace the innerHTML of a draggable without killing it, wrap the content in span and Element.update the span instead and your draggable will still work afterwards.<br> <br> Also, in the future, please don''t post attachments. Instead, put up a live page on your own server and post a link.<br> <br> Thanks,<br> Colin<br> <br> David Welton wrote: <blockquote cite="mid:9877cd600702261418i2f2c3b07ib4f2279ce43cd7ef-JsoAwUIsXosN+BqQ9rBEUg@public.gmane.org" type="cite"> <pre wrap="">Hello, The attached file works fine with firefox, but fails misearably with IE6 - tested via Wine under Linux. I''m encountering a similar problem in an application of mine in which a container gets replaced. If it''s of any use at all, the ugly IE window says the error is on line 364, character 5, error is ''object required''. Any help or ideas would be welcome... Thankyou, </pre> <br> <hr size="4" width="90%"><br> <title>script.aculo.us Drag and drop functional test file</title> <meta http-equiv="content-type" content="text/html; "> <script src="../../lib/prototype.js" type="text/javascript"></script> <script src="../../src/scriptaculous.js" type="text/javascript"></script> <script src="../../src/unittest.js" type="text/javascript"></script> <style type="text/css" media="screen"> #dragger { background-color: blue; } #dropper { background-color: green; } </style> <h1>script.aculo.us Drag and drop functional test file</h1> <h2>Draggables/Droppables</h2> <div id="draggercontainer"> <div id="dragger"> To be dragged. </div> <script type="text/javascript" language="javascript" charset="utf-8"> // <![CDATA[ new Draggable(''dragger'',{revert:true}); // ]]> </script> </div> <div id="otherdraggercontainer"> <div id="otherdragger"> Don''t drag this </div> <script type="text/javascript" language="javascript" charset="utf-8"> // <![CDATA[ new Draggable(''otherdragger'',{revert:true}); // ]]> </script> </div> <br> <div id="dropper"> To be dropped on. </div> <script type="text/javascript" language="javascript" charset="utf-8"> // <![CDATA[ function newDragger() { Element.update(''draggercontainer'', $(''otherdraggercontainer'').innerHTML); } Droppables.add(''dropper'',{onDrop:newDragger}); // ]]> </script> </blockquote> <br> --~--~---------~--~----~------------~-------~--~----~<br> You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. <br> To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org <br> To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org <br> For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en <br> -~----------~----~----~----~------~----~------~--~---<br> </body> </html> <br>
> I don''t know what you''re trying to accomplish with this,I am trying to update a div dynamically. In my application, it replaces it with an async http request, but the net effect seems to be the same in terms of IE.> but you are > overwriting the innerHTML of one node with that of another than contains an > id declaration, so for one thing you no longer have unique ids in your DOM.Ok, that''s an error on my part. I updated the updater function to do this: Element.update(''draggercontainer'', $(''otherdraggercontainer'').innerHTML); Element.remove(''otherdraggercontainer'');> IE has different behavior than FF with respect to non-unique ids so this is > probably your problem.. Anyway, using script tags inside of a div and > calling Element.update with the innerHTML to recreate the draggable is not a > good idea. You should rethink what you are trying to do exactly.. If you > want to replace the innerHTML of a draggable without killing it, wrap the > content in span and Element.update the span instead and your draggable will > still work afterwards.I think this is closer to the actual problem. It seems as if it''s not possible to add a new draggable in IE by dynamically updating an element? I suppose I need to find a workaround, because my app functions by replacing a whole series of draggables every now and then.> Also, in the future, please don''t post attachments. Instead, put up a live > page on your own server and post a link.Oops, sorry. I have placed it here: http://dedasys.com/dragdrop10_test.html Here''s something strange, though. When I use the .js files from here to drive that page, I can complete the drag and drop of the blue element. http://script.aculo.us/playground/ I can''t seem to drop the remaining div in that case, though. However, if I switch over to using the latest .js files from subversion, things go haywire much quicker. As soon as I''m done with the drop, I can''t even mouse over the page without getting errors. I tried playing around with .destroy()ing the drag/dropped element and a few other things, but none of them were successful on IE, and none of them generated errors at all in Firefox. Thanks for any insights, -- David N. Welton - http://www.dedasys.com/davidw/ Linux, Open Source Consulting - http://www.dedasys.com/ --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
I think you should try to design this system more in javascript and less in HTML. I.e. Store your draggables in a cache somewhere and add and remove them via pure JS, not using embedded script tags. This may not do *exaclty* what you''re trying to do but it is a (very good) start: <div id="draggables"></div> <div id="otherdraggables"></div> <script type="text/javascript"> DraggableCache = Class.create(); DraggableCache .prototype = { initialize: function(parent,options){ this.parent = $(parent); this.options = options; this.cache = new Cache(); }, add: function(id,content,options){ var newDrag = $(Builder.node(''div'',{id:id})); newDrag.update(content); this.parent.appendChild(newDrag); options = options ? Object.extend(Object.clone(this.options),options) : this.options; this.cache.insert(new Draggable(newDrag,options, id); }, get: function(id){ return this.cache.get(id); }, insert: function(draggable){ //insert an existing draggable this.cache.insert(draggable); if(!draggable.element.descendantOf(this.parent)){ this.parent.appendChild(draggable.element); } }, remove: function(id){ //remove from cache but do not destroy var draggable = this.cache.remove(id); draggable.element.parentNode.removeChild(draggable.element); return draggable; }, destroy: function(id){ this.cache.remove(id).dispose(); $(''id'').remove(); }, clear: function(){ this.cache.each(function(draggable){ var element = draggable.element; draggable.dispose(); element.remove(); }).clear(); } }; var drags= new DraggableCache(''draggables'',{revert: true}); var otherdrags = new DraggableCache(''otherdraggables'',{revert:true}); //insert new draggables drags.add(''someUniqueId'',''To be dragged'',{ change: function(){ alert(''this function applies only to this draggable''); } }); otherdrags.add(''anotherUniqueId'',''Don\''t drag this''); //retrieve a draggable var someDraggable = drags.get(''someUniqueId''); //remove a draggable with id= ''someUniqueId'' drags.destroy(''someUniqueId''); //transfer a draggable from one cache to another: otherdrags.insert(drags.remove(''someUniqueId'')); //remove ALL draggables to make room for new ones drags.clear(); </script> There are likely some bugs in that code as I typed it all into Thunderbird just now ;) Using something like this to handle all of your draggable creation/destruction will make things much easier, not to mention this actually does proper cleanup whereas before your were leaking memory each time you created a new one over the top of an old one. In your Ajax requests I recommend using a JSON encoded response so that in your onSuccess function you can loop through creating your new draggables: server response is a json encoded hash with an "elements" property that contains an array of hashes of {id, content} onSuccess: function(xhr, json){ //beware of header size limitations with this method if(!json || !json.elements){ alert(''Didn''t get expected response''); } drags.clear(); $A(json.elements).each(function(drag){ drags.add(drag.id, drag.content); } } Pretty easy, no? Hope this helps. Colin P.S. Here is the Cache class, I created it for a patch I''m working on for Prototype''s event system and it comes in handy here as well :) Maybe someday it''ll be Prototype core? It is extended with Enumerable so most if not all of those functions will work as expected. Since it doesn''t extend the Object used for storage it performs better than Hash and has simple (and fast, without is not fast) add/remove methods for convenience when dealing with caches. ------------------------ var Cache = Class.create(); Cache.prototype = { initialize: function(){ this.hash = {}; this.length = 0; }, _each: function(iterator) { for (var key in this.hash){ iterator(this.hash[key]); } }, clear: function() { this.hash = null; this.initialize(); return this; }, insert: function(value,key){ key = key || this.length++; this.hash[key] = value; return key; }, remove: function(key){ var value = this.hash[key]; delete this.hash[key]; return value; }, get: function(key){ return this.hash[key]; } }; Object.extend(Cache.prototype, Enumerable); ------------------ --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
On 2/27/07, Colin Mollenhour <eliteii92g-NPSFNn/7+NYVo650/ln6uw@public.gmane.org> wrote: Hi, thanks for your extensive response!> I think you should try to design this system more in javascript and less > in HTML.Yes, I suppose you''re right. I have everything working quite nicely with Rails, but it uses a more direct, brutal ''replace everything and set up new drag/drops'' each time, which isn''t taking full advantage of JS.> I.e. Store your draggables in a cache somewhere and add and > remove them via pure JS, not using embedded script tags. > This may not do *exaclty* what you''re trying to do but it is a (very > good) start:It is indeed - thanks!> There are likely some bugs in that code as I typed it all into > Thunderbird just now ;) > Using something like this to handle all of your draggable > creation/destruction will make things much easier, not to mention this > actually does proper cleanup whereas before your were leaking memory > each time you created a new one over the top of an old one.I''m curious about the ''leaking memory'' thing... isn''t this stuff GC''ed? Or are FF and IE bad at that? I''m pretty used to dynamic languages just taking care of stuff when it''s not referenced by anything else. Just out of curiousity, does anyone know what the limitations are in IE that are causing the original problem I mentioned? Thankyou, -- David N. Welton - http://www.dedasys.com/davidw/ Linux, Open Source Consulting - http://www.dedasys.com/ --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type"> </head> <body bgcolor="#ffffff" text="#000000"> If by garbage collection you mean real-time, then no. Most browsers will cleanup pretty thoroughly when you refresh or load a new page, but in the scope of a single page there is very little GC. Try this page that I setup a few weeks ago to test various Event handling libraries: (disable Firebug for most consistent results)<br> <a class="moz-txt-link-freetext" href="http://colin.mollenhour.com/events/test.html?rev=hybrid">http://colin.mollenhour.com/events/test.html?rev=hybrid</a><br> <br> Open Task Manager or whatever memory monitoring tool you use and click "Create Elements", now click "Make ToolTips". Ok, memory usage went up quite a bit. Now click "Cleanup" and then "Clear". Memory usage probably didn''t go down, but that isn''t leaked memory it is just memory that seems to be allocated to that page still, because if you repeat the above steps again it won''t go up any more this time. Now reload the page and you''re back to what you started with roughly. However, if you repeat the above steps two or more times but forgetting to click "Cleanup", the memory usage for that page will go up more each time. You''ll still get it all back when you reload the page again, but that is what I''m referring to when I say memory leaks. For many sites it isn''t so critical because they may have a shorter lifetime or simply not much memory usage to begin with, but I try to design everything in such a way that it would scale in the worst of circumstances.<br> <br> Your original problem was non-unique ids.. you were copying the innerHTML of a node that contained another node with an id specified so it was trying to create a second node with the same id. I think FF and IE handle this differently but it would have cropped up as a problem in FF eventually as well.<br> <br> Colin<br> <br> <br> David Welton wrote: <blockquote cite="mid:9877cd600703041303g165a12dbh5750564919b3ac8-JsoAwUIsXosN+BqQ9rBEUg@public.gmane.org" type="cite"> <pre wrap="">On 2/27/07, Colin Mollenhour <a class="moz-txt-link-rfc2396E" href="mailto:eliteii92g-NPSFNn/7+NYVo650/ln6uw@public.gmane.org"><eliteii92g-NPSFNn/7+NYVo650/ln6uw@public.gmane.org></a> wrote: Hi, thanks for your extensive response! </pre> <blockquote type="cite"> <pre wrap="">I think you should try to design this system more in javascript and less in HTML. </pre> </blockquote> <pre wrap=""><!----> Yes, I suppose you''re right. I have everything working quite nicely with Rails, but it uses a more direct, brutal ''replace everything and set up new drag/drops'' each time, which isn''t taking full advantage of JS. </pre> <blockquote type="cite"> <pre wrap="">I.e. Store your draggables in a cache somewhere and add and remove them via pure JS, not using embedded script tags. This may not do *exaclty* what you''re trying to do but it is a (very good) start: </pre> </blockquote> <pre wrap=""><!----> It is indeed - thanks! </pre> <blockquote type="cite"> <pre wrap="">There are likely some bugs in that code as I typed it all into Thunderbird just now ;) Using something like this to handle all of your draggable creation/destruction will make things much easier, not to mention this actually does proper cleanup whereas before your were leaking memory each time you created a new one over the top of an old one. </pre> </blockquote> <pre wrap=""><!----> I''m curious about the ''leaking memory'' thing... isn''t this stuff GC''ed? Or are FF and IE bad at that? I''m pretty used to dynamic languages just taking care of stuff when it''s not referenced by anything else. Just out of curiousity, does anyone know what the limitations are in IE that are causing the original problem I mentioned? Thankyou, </pre> </blockquote> <br> --~--~---------~--~----~------------~-------~--~----~<br> You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. <br> To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org <br> To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org <br> For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en <br> -~----------~----~----~----~------~----~------~--~---<br> </body> </html> <br>