another way is (thats what i´ve done) to first add a wrapper inside that element you want to attach a Controller:
- <div id="widgetbox"></div>
then..
- // add new element inside
- $('#widgetbox').append('<div class="Controller"></div>');
- // attach the controller to this element
- var weatherWidget = new WeatherWidget("#widgetbox .Controller",{});
so everytime i want to remove a instance from the dom, i just can call the instance´s element remove method
- weatherWidget.element.remove();
and the dom is cleaned and events removed. job done.
It´s a bit dirty because you have to add a new dom node yourself every time, but it works. i´m curious that the docs dont say a word about how to glue everything (or complex apps) together.
Backbone address this with Views (they have no Controllers) that dont attach themselves to a dom element, it creates a new one in memory instead.
- var widget = new WeatherWidget(); // Backone.View
- widget.render() // process templates n stuff
- $('#widgetbox').append( widget.el ); // append the dom element or process it further
- widget.remove(); // dom & event cleanup
you end up with the same html structure you started.