backbone.js and express: trouble searching a mongodb collection by field with a query string

I am new to backbone, express, and mongodb. I am trying to pass a query string to search a mongodb collection by field. I am doing something wrong. If I comment out the "fetch" from my router, the page is found. If I try to fetch, then I get a page not found error. I've tried to isolate where it's breaking, but the backbone architecture is still confusing to me. Thanks in advance. (I'm betting it's a syntax issue in my mongodb call) kristin

Here is my code.

this URL should return a collection where "type" = 3.

localhost:8888/#content/3

model/models.js:

window.Content = Backbone.Model.extend({

   urlRoot: "/content",

    idAttribute: "_id"

});

window.ContentCollection = Backbone.Collection.extend({

    model: Content,

    url: "/content"

});

views/content.js

window.ContentListView = Backbone.View.extend({

    initialize: function () {
        this.render();
    },

    render: function () {

        //return this;

       this.$el.append('<ul class="thumbnails">');

        this.collection.each(function(model) {
            this.$('.thumbnails').append(new ContentView({model: model}).render().el);
        }, this);

        return this;
    } });

window.ContentView = Backbone.View.extend({

    tagName: "li",

    initialize: function () {
        this.model.bind("change", this.render, this);
        this.model.bind("destroy", this.close, this);
    },

    render: function () {
        $(this.el).html(this.template(this.model.toJSON()));
        return this;
    }

});

views/main.js

var AppRouter = Backbone.Router.extend({

    routes: { "content/:type" : "contentType" },

    contentType: function(type) {
        var contentList = new ContentCollection({type : type});
        contentList.fetch({success: function(){
            $("#content").empty().append(new ContentListView({collection: contentList}).el);
        }});
        this.headerView.selectMenuItem('build-menu');
    },

    utils.loadTemplate([
       'ContentView'
    ], function() {
    app = new AppRouter();
    Backbone.history.start(); });

contentView.html

name (<% tag won't print here)

routes/modules.js

exports.findContentByType = function(req, res) {

    var type = req.params.type;

    db.collection('content', function(err, collection) {

        collection.find({'type': type.toString()}).toArray(function(err, items) {

            res.send(items);
        });

    }); 

};

server.js

app.get('/content/:type', module.findContentByType);

I can see a couple of problems here:

  1. this.headerView.selectMenuItem('build-menu'); (in the router) implies you've defined headerView in the router object, but it's not defined.
  2. Similarly, this.template inside ContentView is not defined

When I remove the line in #1, and and define a dummy template in ContentView:

template: _.template("<div> Test: <%= version %> </div>"),

Then the view at least renders -- see here. (This is with dummy data -- I can't confirm that your server is returning valid/expected JSON.)