Question

I’m facing an issue with my backbone.js app: I’m trying to fetch data from a JSON webservice, the GET HTTP request is successfull (i had a look in the developer console of chrome) but backbone fetch trigger an error and doesn’t update the model.

You can have a look here to the code:
https://github.com/tdurand/faq-app-client-mobile

And you can run the app and try to debug here:
http://tdurand.github.com/faq-app-client-mobile/

The JSON Feed is like this

[
    {
       "title":"Probleme ou Bug",
       "desc":"Pour les problemes ou les bugs rencontrés",
       "entries":[
           {
             "title":"testdqs",
             "desc":"testqsdqs"
           }
        ]
    }
]

My collection model is:

var Categories = Backbone.Collection.extend({

url:"http://cryptic-eyrie-7716.herokuapp.com/faq/fr",

model:Category,

parse:function(response) {
    console.log("test")
    console.log(response);
    return response;
},

sync: function(method, model, options) {
    var params = _.extend({
        type: 'GET',
        dataType: 'jsonp',
        url: model.url,
        processData:false
    }, options);

    return $.ajax(params);
},

});

And my view:

var IndexView = Backbone.View.extend({

el: '#index',

initialize:function() {
    Categories.fetch({
        success: function(m,r){
          console.log("success");
          console.log(r); // => 2 (collection have been populated)
        },
        error: function(m,r) {
          console.log("error");
          console.log(r.responseText);
        }
    });
    Categories.on( 'all', this.render, this );
},

//render the content into div of view
render: function(){
  //this.el is the root element of Backbone.View. By default, it is a div.
  //$el is cached jQuery object for the view's element.
  //append the compiled template into view div container
  this.$el.html(_.template(indexViewTemplate,{categories:Categories}));
  //Trigger jquerymobile rendering
  $("#index").trigger('pagecreate');

  //return to enable chained calls
  return this;
}
});
return IndexView;

Thanks a lot for your help

Answer 1

I found my mistake.

My backend server (with play! framework), was not rendering JSONP properly

This is the code i now use to do it if someone has the same issue.

    //Render JSONP
    if (request.params._contains("callback")) {

        Gson gson = new Gson();

        String out = gson.toJson(categoryJSON(categories,lang));

        renderText(request.params.get("callback") + "(" + out + ")");

     } else {

        renderJSON(categoryJSON(categories,lang));

     }