How to display findAll from JSON with Ember-data, in View? - ember.js

Question

I'd like to display a list populated with data from a JSON file. I would use a modified Adapter. Here's the code so far, including path to the test json file (since I'd hope to get some help without the use of FIXTURES)
I'm unsure on how to pushObject for results using Ember-Data. I know I'm probably still not getting some concepts for Ember-Data.
My question is: How do I get a list from the JSON file based on the following code.
JavaScript
App = Em.Application.create();
App.store = DS.Store.create({
revision: 4,
adapter: App.adapter
});
App.adapter = DS.Adapter.create({
findAll: function (store, type) {
console.log('finding');
var url = type.url;
$.getJSON(url, function(data) {
store.loadMany(type, data);
});
}
});
App.Person = DS.Model.extend({
fName: DS.attr('string'),
surname: DS.attr('string'),
url: 'test.json',
});
App.personController = Ember.ArrayController.create({
content: [],
init: function(){
this._super();// create an instance of the person model
this.set('person', App.store.findAll(App.Person));
},
});
HTML
<script type="text/x-handlebars">
{{#each App.personController}}
<p>{{fName}} {{surname}}</p>
{{/each}}
</script>
EDIT
I´ve updated the code in the jsfiddle on #pauldechov recommendations, still no luck.
Here's the content for test.json, so the whole app can be recreated:
[{"name": "Bruce","surname": "Banner"},
{"name": "Peter","surname": "Parker"},
{"name": "Natasha","surname": "Romanoff"},
{"name": "Steve","surname": "Rogers"},
{"name": "Tony","surname": "Stark"}]

Answer 1

The url property should be defined as such:
App.Person = DS.Model.extend({
fName: DS.attr('string'),
surname: DS.attr('string'),
}).reopenClass({ url: 'test.json' });
...as an instance variable rather than as a class variable (see example: https://github.com/emberjs/data#find). The way you defined it (or if you use .reopen({...}) instead of .reopenClass({...}), it would be accessible via (a specific) person.url rather than type.url.
AFAIK you can't add a .json file to jsfiddle's resources; it won't be accessible. Querying the full url of test.json yielded a cross domain issue.
You may need to place the model(s) above App.adapter, above App.store. Try this if it's still failing.
Peripheral observation: "name" in test.json vs. "fName" in the code?

Answer 2

App.personController = Ember.ArrayController.create({
content: [],
init: function(){
this._super();// create an instance of the person model
this.set('person', App.store.findAll(App.Person));
},
});
Why set person? Should it not be set content?