Question

I just started looking at Backbone.js. Now i wan’t to create a simple search similar to google where the url updates “on the go”. So if you submit a form i want the url to update to http://www.site.com/#/search/I-searched-for-something.

I appreciate every answer 🙂

Answer 1

If I understand the question, you want an arbitrary URL that includes your search term as part of the URL. And I suspect that your problem is you don’t see how to do that with the routes architecture.

Routes are nothing but regular expressions:

var MyController = Backbone.Controller.extend({
    routes: {
        RegExp('^search/(.*)$'): "handle_search"
    },

    handle_search: function(search_term) {
        search_term = decodeURIComponent(search_term);
        /* Do something ajaxy with the search term in the search model,
           which in turn triggers the search view to refresh... */
    }
});

After that, you would apply a click handler to the button on the search form (or maybe a keypress==13 manager to the search field itself) that, instead of actually doing anything, just sets window.location.hash = escapeURIComponent($('#search_field').val())

It’s roundabout, but it gets the job done. Your URLs will be ugly with all the %XX’s in them, but they’ll all be bookmarkable, which is the only reason to do something like this.