I have a simple application which must display a list of JSON objects Data properly. After I navigate to the index page and I click on link “Risk types” I come up with the following set of errors (from the Chrome Ember inspector):

DEPRECATION: Action handlers contained in an events object are deprecated in favor of putting them in an actions object (error on )

Error while loading route

Uncaught #Object

I suspect the error originates from my store definition. When I define modified the route’s model as

var mod = rt;

instead of

var mod = this.store.findAll('risktype');

everything works fine.

The response (an array of 2 JSon objects) comes from a Java servlet on a Tomcat server. The trace (attached) shows that responseText is correctly obtained from returned by the backend server.

Does anyone has a clue about it?

Here is my code:

var App = Ember.Application.create({
    LOG_TRANSITIONS: true,
    LOG_TRANSITIONS_INTERNAL: true,
});

App.Router.map(function () {
  this.route('risktypes', {path: '/risktypes'});
});

App.RisktypesRoute = Ember.Route.extend({
    model: function() {
        var mod = this.store.findAll('risktype');
    //    var mod = rt;
        return mod;
    }
});

var rt = [ { 'id': 1011, 'code': 'CODE1', 'description': 'Type 1', 'state': 'NEW' },
           { 'id': 2021, 'code': 'CODE2', 'description': 'Type 2', 'state': 'VALID' }]

App.RisktypesController = Ember.ArrayController.extend();

App.Store = DS.Store.extend({
    adapter: DS.RESTAdapter.extend({
        namespace: 'ember-profiler-webapp/app'
    })
//  , revision: 1
});

App.store = App.Store.create();

App.Risktype = DS.Model.extend({
    code: DS.attr('string'),
    description: DS.attr('string'),
    state: DS.attr('string')
})


Here is file index.html:




  
  

  
  
  
  
  

  
    
    

(application)

    {{outlet}}
    
  

  
  

(index)

This is the index template.

  {{#link-to 'risktypes'}}
    Risk types
  {{/link-to}}



  

This is the risktypes template.

{{#each controller}} {{/each}}

Error message below Modifying into the trace “Error while loading route” following made no improvement:

Object {readyState: 4, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function.}
abort: function ( statusText ) {
always: function () {
complete: function () {
done: function () {
error: function () {
fail: function () {    
getAllResponseHeaders: function () {
getResponseHeader: function ( key ) {
overrideMimeType'risktypes': function ( type ) {
pipe: function ( /* fnDone, fnFail, fnProgress */ ) {
progress: function () {[
promise: function ( obj ) {
readyState: 4
responseText: "[ { 'id': 1011, 'code': 'CODE1', 'description': 'Type 1', 'state': 'NEW' },
                 { 'id': 2021, code''code': 'CODE2', 'description': 'Type 2', 'state': 'VALID' }]"
setRequestHeader: function ( name, value ) {
state: function () {
status: 200
statusCode: function ( map ) {
statusText: "OK"
success: function () {
then: null]
__proto__: Object}

It looks like I am not using Ember Data properly.

I modified the JSon objects returned by the backend server. Was:

[ 
  { 'id': 11, 'code': 'CODE1', 'description': 'Type 1', 'state': 'NEW' },
  { 'id': 21, 'code': 'CODE2', 'description': 'Type 2', 'state': 'VALID' }
]

Modifying into the following made no change:

{ 'risktypes':  
 [
   { 'id': 11, 'code': 'CODE1', 'description': 'Type 1', 'state': 'NEW' },
   { 'id': 21, 'code': 'CODE2', 'description': 'Type 2', 'state': 'VALID' }
 ]
}

Does anyone have a hint for this? It would be a shame to switch to Angular.js for such a trivial beginner error!

Thanks

Originally posted 2013-11-23 09:51:07.