1

I write an application which consists from nested tabs. As an example I took https://github.com/tbranyen/backbone-boilerplate. I also use RequireJS.

I have at least two levels of nested tabs. Some of them have similar structure and I can reuse their views.

For example, I have the tab named "Articles" which contains the tabs: "New", "Changed", "Deleted" (in practise the number of tabs is much more). I have about the following routes:

/articles
/articles/new
/articles/changed/
/articles/deleted

These routes maps to the method named "showPanel" which takes two arguments: panel and subPanel. Using these arguments I want to show needed panel.

Is there any pattern which I can apply to resolve this issue or any other examples? Thanks!

Igor Timoshenko
  • 1,001
  • 3
  • 14
  • 27

1 Answers1

1

look at this, hope to be able to help you :)

showPanel method is a general method, show panel and subPanel:

function showPanel(panel, subPanel){
  $('#panels').children().hide().filter(panel).show().children().hide().filter(subPanel).show();
}

routes config:

var Router = Backbone.Router.extend({
  routes: {
    'articles': 'articlesPanel',
    'articles/:subPanel': 'articlesSubPanel'
  },
  articlesPanel: function(){
    showPanel('#articles', '');
  },
  articlesSubPanel: function(subPanel){
    showPanel('#articles', '#'+subPanel);
  }

});
anhulife
  • 566
  • 2
  • 7