Question

I am trying to implement a search function for my website. When the user types a search term foobar into a input box and submits it, he is redirected to http://mydomain.com/search?query=foobar.

Problem:: How should I grab the GET parameters query from the URL, and send it to the backend and get a array of results back as a JSON response? Should I even do it this way?

My current attempt below does not even cause the search function to be triggered.

Router

var AppRouter = Backbone.Router.extend({
    routes: {
        'search?query=:query': 'search'
        // ... and some other routes
    },

    search: function(query) {
        this.photoList = new SearchCollection();
        var self = this;
        this.photoList.fetch({
            data: {query: query},
            success: function() {
                self.photoListView = new PhotoListView({ collection: self.photoList });
                self.photoListView.render();
            }
        });
    }

});

var app = new AppRouter();
Backbone.history.start({
    pushState: true,
    root: '/'
});

Answer 1

There have been several issues filed against Backbone for this very issue. There is an existing plugin that works well for this:

https://github.com/jhudson8/backbone-query-parameters

Alternatively, I’m currently using query string parameters in a mock API that matches Backbone’s route matching. Looks something like this

Route

"/api/v2/application/:query"

Query

application: function(query) {
  var params = $.deparam(query.slice(1));
  // params.something...
}

As to your actual issue at hand how are you redirecting to index.html to support pushState?