$.appendTo(document.body) references????

[JazzParticipant]

Is it correct that most widgets are doing this? Personally I think it’s bad form to blindly append dynamically created elements to the end of the document as these elements will then fall outside a logical scope defined by the developer.

For example, I’m having an issue where I load content into a DIV (using $(‘#div’).load()) and activate some widgets, namely the dropDownList and dateTimeInput in this case. At which point the widgets write their additional structure elements to the end of the document. Multiple reloads of the same content then cause the previous widgets structure elements to do random things, like show up over the top of other elements, because these elements are outside the DIV that I’m loading content into, and hence do not automatically get destroyed on subsequent calls to load().

This is, quite frankly, a pain in the back side. If the content of the DIV is reloaded then for each subsequent load the document gets appended with elements of the widget structure, which depending on how many times the content is loaded causes things to get quite clogged and messy there at the end of the document with potentially 10s or even 100s of elements that are no longer used.

If the dynamically created elements were simply appended AFTER the host element (for example), then they would be on the same level in the DOM structure and hence be destroyed when I call load().

Is there a reason for why widgets operate this way? Some issue that I’m not aware of that makes this the only viable way of making things work?

Otherwise, can we not do this? Personally when I reload/clear an objects contents I’d like it to remove all elements related to widgets it contains, not leave bits of them hanging around at the end of the document that then go off and cause issues down the road.

Hope that all makes sense….

[Peter StoevKeymaster]

Hi,

The widgets are initialized at the point where you call their constructor function. They are destroyed and all of their elements are removed at the point where you call their ‘destroy’ method. That is how they behave by design.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[JazzParticipant]

Um, that’s not exactly the behaviour I’m seeing. The dynamic elements are definitely appended to the end of the document. I have also found in the JavaScript source references to $.appendTo(document.body), which is why I created this thread because I can see this as the cause of my problems.

And yeah, they may be destroyed if I call the ‘destroy’ method on the widget itself, but if I call clear() on the containing DIV (for example), or in my specific case I call load() to load new content, the elements are NOT destroyed.

I suppose my work-around would be to call ‘destroy’ on all widgets BEFORE calling clear() or load() but that’s going to be a stack of code. In my opinion it would just be better if the widgets didn’t blindly append stuff to the end of the document and kept their dynamic elements either inside the host element or at least at the same level on the DOM so that if I call clear(), everything is just dealt with.

[Author]

Posts