How to fetch the url query params in backbone

Question

I am working on a backbone application with routers and all, I am facing one issue in fetching the query params from the url, I didn't find any straight forward way to figure it out.

I have a url like test.com/main/page1?state=code&value=blaa

I wanted to take the value of state and value from the url with the backbone routers way. Please help me to find a solution.

[Here's a plugin to allow more control - https://github.com/jhudson8/backbone-query-parameters](https://github.com/jhudson8/backbone-query-parameters) — John C, Jul 03 '14 at 07:47
Check out [navigate route with querystring](http://stackoverflow.com/q/11671400/722238) as well. — fbynite, Jul 03 '14 at 07:53

score 4 · Answer 1 · answered Jul 03 '14 at 19:19

4

They've created Execute for you to do awesome things like parse query strings before the route is called. more info: http://backbonejs.org/#Router-execute

answered Jul 03 '14 at 19:19

Laurens Kling

2,221
1
21
31

score 1 · Answer 2 · answered Jul 03 '14 at 10:16

@Prats: Yes you can get the intermediate page(not home page) url parameter values by the following way.

router.js

 backboneApp.Routers.MyrouterRouter = Backbone.Router.extend({

    routes:{
        "" : "routeToList",
        "register" : "routeToRegister",
        //Here the actual url along with the fragment(parameters)
        "edit/:id" : "routeToEdit"
    },
    .
    .
    .
    //Other functions.
    .
    .
    .
    //sending the url fragment to render() function....
    routeToEdit: function(id)
    {           
        this.editView = new backboneApp.Views.EditView();
        //Note, this render function from the corresponding view, 
        //can receive the extra fragment(parameter)
        this.editView.render(id);
        this.$content.html(this.editView.el);
    }
    });

edit.js

    backboneApp.Views.EditView = Backbone.View.extend({
    .
    .
    .
    //  some other functions.... 
    .
    .
    .
    render: function(id)
    {
      // The id which I passed received here, from here you can 
      // manipulate as you wanted.

    });

   }

});

Note: I have used the url as edit/:id, for routing. As far your requirement, you can use your url in the routes method by having constant-url/:variable-fragment, so that this variable-fragment passed to your corresponding view's render() function. There you can manipulate the parameters as you wanted. Multiple parameters also possible, if you follow the same concept above but it needs a bit more effort. Hope this helps you.

How to fetch the url query params in backbone

2 Answers2