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>