0

I am trying to make simple app in backbone .Actually I want to call methods when url change .I want to learn how backbone routing works .I studied routing but my alert is not display when I change the url . When I append the url with this “#contacts” but it is not calling this method

listContacts: function () {
          alert("route")
            console.log("route to list contacts was triggered");
            ContactsApp.List.Controller.listContacts();
        }

Can we move to next page or view while click to any item of list .Actually I want to move one page to another after click of row using backbone routing ?

here is my code http://plnkr.co/edit/yN16uPgk0dcJAcrApewH?p=preview

app.module("ContactsApp", function (ContactsApp, app, Backbone, Marionette, $, _) {
   // console.log(app)
    ContactsApp.Router = Marionette.AppRouter.extend({
        appRoutes: {
            "contacts": "listContacts"
        }
    });
    var API = {
        listContacts: function () {
          alert("route")
            console.log("route to list contacts was triggered");
            ContactsApp.List.Controller.listContacts();
        }
    };
    ContactsApp.on("start", function () {
        new ContactsApp.Router({
            controller: API
        });
    });
});

any update using marionette?

user944513
  • 12,247
  • 49
  • 168
  • 318

1 Answers1

0

You need to use Backbone Router. 

var app = new Marionette.Application();

app.addRegions({
  'main': '#main1'
});

var Router = Backbone.Router.extend({
  routes: {
    'item(/*id)': 'item',
    '*params': 'home'
  }
});

app.router = new Router();

// Home route
app.router.on('route:home', function() {
  var page = new HomeView({...})
  app.main.show(page);
});

// Item route
app.router.on('route:item', function(id) {
  var page = new ItemView({id:id, ...})
  app.main.show(page);
});

...

app.start();
Backbone.history.start({pushState: true});

Here is your modified code.

antejan
  • 2,594
  • 12
  • 15