Question

New to using Backbone and have a very simple application. Basically there are Clients and ClientItems. I have a view to show all Clients and if you click on a Client you get taken to their ClientItems. Going to this ClientItems view should just hide the Clients view and going back to Clients should hide ClientItems. Now, in my render() function for each view, it is going through the collections and dynamically adding stuff to the page. When I go back and forth between the two (using the back button) I don’t really need to fully render again as all the data is there in the page, just hidden. Where should this logic go? Right now I have it in the render() function but it feels sloppy, what is the preferred way of handling this?

Answer 1

We are using a global variable App with several common function used across application:

var App = {
    initialize : function() {

        App.views = {
            clientView : new ClientsView(),
            clientItemView : new ClientsItemsView()
        }
    },

    showView: function(view){
        if(App.views.current != undefined){
            $(App.views.current.el).hide();
        }
        App.views.current = view;
        $(App.views.current.el).show();
    },

    ...
}

And then I use this App from other parts of application:

App.showView(App.views.clientView);