How to get ID from URL

1
votes

I am developing a Backbone Marionette web app. I this app I got routes that look like this:

projects/:id/tasks

How can I get the ID of that route (URL)?

If I use this I get the whole URL:

Backbone.history.fragment

Update

This is how I define the routes for projects.

@Projectapp.module "ProjectsApp", (ProjectsApp, App, Backbone, Marionette, $, _) ->

    class ProjectsApp.Router extends Marionette.AppRouter
        appRoutes:
            "projects/new" : "newProject"
            "projects/:id" : "showProject"
            "projects/:id/edit" : "editProject"
            "projects" : "listProjects"

    API =
        listProjects: ->
            new ProjectsApp.List.Controller

        newProject: ->
            new ProjectsApp.New.Controller

        showProject: (id, project) ->
            new ProjectsApp.Show.Controller
                id: id
                project: project

        editProject: (id, project) ->
            new ProjectsApp.Edit.Controller
                id: id
                project: project

    App.Router.on "route:newProject", (project_id) ->
        alert project_id

    App.commands.setHandler "new:crew:member", (region) ->
        API.newCrew region

    App.vent.on "project:new:clicked", (project) ->
        App.navigate "projects/new", true

    App.vent.on "project:tasks:clicked", (project) ->
        App.navigate "projects/#{project.id}/tasks", true

    App.vent.on "project:created", (project) ->
        App.navigate "projects/#{project.id}", true

    App.vent.on "project:show:clicked project:back:clicked", (project) ->
        App.navigate "projects/#{project.id}"
        API.showProject project.id, project

    App.vent.on "project:clicked project:edit:clicked", (project) ->
        App.navigate "projects/#{project.id}/edit"
        API.editProject project.id, project

    App.vent.on "project:cancelled project:list:back:clicked", (project) ->
        App.navigate "projects"
        API.listProjects()

    App.addInitializer ->
        new ProjectsApp.Router
            controller: API
2
backbone.jsmarionette
Where do you want to access it ? Inside the callback method for the specific route ? - Cyclone
I want to access it when fetching new tasks. - Jonathan Clark
Can you update the question with some more code showing where exactly the fetching of new tasks happen ? - Cyclone

2 Answers

2
votes

The router will provide your handler function with the attributes parsed fro the URL.

You have a route defined with "projects/:id" : "showProject" but then your handler is

showProject: (id, project) ->
        new ProjectsApp.Show.Controller
            id: id
            project: project

They don't match: your router will send the parsed id from the URL, but that's it. You need to get the project on your own, before passing it to the view, e.g.:

showProject: (id) ->
        project = @projects_collection.get id
        new ProjectsApp.Show.Controller
            id: id
            project: project

Of course, this means you need to be able to access the project collection, or fetch the project, etc.

1
votes

A router should be defined similar to this (example):

var Router = Backbone.Router.extend({

    routes:{
        "page/:number":"go_to_page",
        "show_something":"show_something"
    },

});

Then, you can bind route events to a function that accepts the route variables, example:

Router.on("route:go_to_page",function(page) {
   // page parameter corresponds to :number in the url hash, so now you can query your models with this string.
});

Hope this example helps...