Sencha seems to not like Rails' json

I've got a Rails controller which is rendering some models to json.

 @events = Event.all
 respo开发者_开发问答nd_to do |format|
  format.html # index.html.erb
  format.xml  { render :xml => @events }
  format.json { render :json => { :results => @events } }
 end

The output looks like this:

{
    "results":
    [
        {
            "name":"test",
            "created_at":"2011-03-23T13:32:57Z",
            "latitude":60.0,
            "location":null,
            "updated_at":"2011-04-14T16:38:54Z",
            "id":1,
            "longitude":30.0,
            "takes_place_at":"2011-03-23T13:32:00Z"
        },
        {
            "name":"x",
            "created_at":"2011-03-23T13:36:44Z",
            "latitude":60.0,
            "location":null,
            "updated_at":"2011-03-23T13:36:44Z",
            "id":2,
            "longitude":30.0,
            "takes_place_at":"2011-03-23T13:36:00Z"
        },
        {
            "name":"Gruempi",
            "created_at":"2011-03-24T14:00:32Z",
            "latitude":60.0,
            "location":null,
            "updated_at":"2011-04-14T16:39:47Z",
            "id":3,
            "longitude":30.0,
            "takes_place_at":"2011-03-24T14:00:00Z"
        },
        {
            "name":"ba",
            "created_at":"2011-04-10T22:40:07Z",
            "latitude":60.0,
            "location":"12,
            14",
            "updated_at":"2011-04-10T22:40:07Z",
            "id":4,
            "longitude":30.0,
            "takes_place_at":"2011-04-10T22:36:00Z"
        },
        {
            "name":"sfasdfs",
            "created_at":"2011-04-10T22:44:55Z",
            "latitude":60.0,
            "location":"we're try to find you ...",
            "updated_at":"2011-04-10T22:44:55Z",
            "id":5,
            "longitude":30.0,
            "takes_place_at":"2011-04-10T22:42:00Z"
        },
        {
            "name":"asdfsad",
            "created_at":"2011-04-10T22:55:03Z",
            "latitude":60.0,
            "location":"we're try to find you ..asfd.",
            "updated_at":"2011-04-10T22:55:03Z",
            "id":6,
            "longitude":30.0,
            "takes_place_at":"2011-04-10T22:54:00Z"
        }
    ]
}

and I try to consume the service with sencha/extjs:

refresh = function() {
  Ext.util.JSONP.request({
    url: 'http://localhost:3000/search/by_date.json',
    callbackKey: 'callback',
    params: {
      year:"2011",
      month:"04",
      day:"10",
      uniqueify: Math.random()
    },
    callback: function(data) {
      var events = data.results;
      timeline.update(events);
    }
  });
};

and sencha just doen't parse it. Meanwhile it works with an API-call like Twitter.

Any ideas what I've done wrong? Or how I can find the bug?

If you are doing a JSONP request you will need to wrap the returned JSON in the function that is specified as a parameter in the GET request, in your case 'callback'. Sencha touch will handle the function naming internally but you do need to take note of the callbackKey option you pass in so that your server can respond properly.

When requesting http://localhost:3000/search/by_date.json?callback=jsonP2343243243 the expected response should be wrapped in a function that is specified by the callback parameter. That GET request should result in the following JSON:

jsonP2343243243({ "results": [ ... ] });

This will cause that function to be called when it is interpreted by the browser and then the callback of the AJAX will be called. In rails you would need to change your rendering to something like:

Rails < 3.0:

format.js { render :js => params[:callback] + "(" + { :results => @events }.to_json + ");"} 

Rails > 3.0

format.js { render :json => { :results => @events },  :callback => params[:callback] }