JSON not showing up in Ember.js app
I have this strange issue in which I can see the returned JSON in the
console but it's not loading,
Here's my code so far,
App = Ember.Application.create({});
App.IndexRoute = Ember.Route.extend({
renderTemplate : function(controller) {
this.render('MyApp', {
controller : controller
});
},
model : function() {
return App.MyTemplateModel.find();
}
});
App.IndexController = Ember.ArrayController.extend({
filteredContent : Ember.computed.oneWay("content"),
last : function() {
var lastName = App.controller.get('selectedProgrammer.last_name');
var filtered = this.get('content').filterProperty('last_name',
lastName);
this.set("filteredContent", filtered);
},
refresh : function() {
var refresh = this.get('content');
this.set("filteredContent", refresh);
}
});
App.MyTemplateModel = Ember.Model.extend({
id : Ember.attr(),
last_name : Ember.attr(),
first_name : Ember.attr(),
suffix : Ember.attr(),
expiration : Ember.attr()
});
App.controller = Ember.Object.create({
selectedProgrammer : null,
content : [Ember.Object.create({
last_name : "Solow",
id : 1
}), Ember.Object.create({
last_name : "Arbogast",
id : 2
}), Ember.Object.create({
last_name : "Dorfman",
id : 3
}), Ember.Object.create({
last_name : "Eliason",
id : 4
})]
});
App.MyTemplateModel.url =
"http://admin:1234@animatorapi.us/api/example/users";
App.MyTemplateModel.adapter = Ember.RESTAdapter.create({
ajaxSettings: function(url, method) {
return {
url: url,
type: method,
dataType: "jsonp",
contentType: 'application/json; charset=utf-8'
};
}
});
App.MyTemplateModel.dataType ="jsonp";
var existing = App.MyTemplateModel.find();
App.MyTemplateModel.camelizeKeys = true;
I had this issue where I was getting "XmlHttpRequest error: Origin null is
not allowed by Access-Control-Allow-Origin", so I had to change dataType
to jsonp.
Here's my HTML as well,
<script type="text/x-handlebars" data-template-name="MyApp">
<input type="text" id="name" placeholder="name!"/>
<button >Button</button>
{{view Ember.TextField valueBinding="userName"}}
<label >{{userName}}</label>
{{#each item in filteredContent }}
<tr><td>
{{id}} <p> </p>
</td></tr>
{{/each}}
<button >filter</button>
{{view Ember.Select
contentBinding="App.controller.content"
optionValuePath="content.id"
optionLabelPath="content.last_name"
selectionBinding="App.controller.selectedProgrammer"}}
<button >refresh</button>
</script>
<script type="text/x-handlebars">
<h1>Application Template</h1>
{{outlet}}
</script>
Any suggestions as where I might be wrong?
No comments:
Post a Comment