Fetch Backbone.Collection by JSON object - backbone.js

in jQuery we can supply json when perform GET operation. But I don't see any options in backbone to supply object like backbone.collection.create or update
collection.fetch({
data: {
ip_id: this.column
},
success: this.constructing
});
this is what can I think of right now

Since this.column is a json object, you need to stringify it. Try this
collection.fetch({
data: {
ip_id: JSON.stringify(this.column)
},
success: this.constructing
});

Related

Accessing additional properties from JSON received through store's load method

I have a grid that loads data via a JSON store, however there are some additional properties beyond the records themselves that I need to access. Here's an example of what the JSON data looks like:
{
success: true,
records: [
{id: 1, name: 'bob'},
{id: 2, name: 'fred'}
],
extraProperty: 'foo'
}
I need to access that extraProperty when the grid data is loaded. So I assume I'd want to a callback, like so:
store.load({
callback: function (records, operation, success) {
//somehow access extraProperty here
}
});
I'm not sure what to do inside that callback. The operation variable, an Ext.data.operation.Operation object, has a private method called getResponse(). It returns an object in Chrome that has a responseJson property, but in IE it instead has a responseText property that needs to be decoded. So I could handle both scenarios, but since it's a private method I don't really want to rely on it in the first place. Any ideas?
Use the keepRawData config on the reader.
store.load({
callback: () => {
const { extraProperty } = store.getProxy().getReader().rawData;
}
});
Depending on your needs, you may also want to look at preserveRawData as well.
did you tried on the store level, something like below
under proxy in the reader config section
proxy: {
type: 'ajax',
actionMethods: {
read: 'GET'
},
headers: {
'Content-Type': 'application/json;charset=utf-8'
},
api: 'your url',
reader: {
extraProperty: 'extraProperty'
}
}

in Backbone, is it possible to tell fetch that it if it reads content that is content-type:'text/plain' to read it as JSON

I have a webserver that is sending back json files as 'text/plain'. I unfortunately can't adjust this. Can I tell a backbone fetch on a collection to read it as JSON even if it has this content/type? Like an emulateJSON for the response?
thx
Basically want to fix this:
Here's my backbone code that I'm having problems with (total backbone noob so I know there is most likely something wrong with how I'm handling this):
var MyItemList=Backbone.Collection.extend({url:'items.json', model:MyItem,
// not sure if I need this?
parse: function(response) {
return response.results;
}
});
var AppRouter=Backbone.Router.extend({
routes:{'':'list','detail/:id':'detail'},
list:function(){
var itemList=new MyItemList();
itemList.fetch({ dataType:'json',
error: function () {
console.log("error!!");
},
success: function () {
console.log("no error");
}
}).complete(function () {
console.log('done');
console.log('length1:' + itemList.length);
});
console.log('length2: '+ itemList.length);
}
my json:
Remove parse method:
With Parse:
Backbone uses jQuery.ajax under the hood for the ajax requests.
So you need to use the dataType: 'json' options to specify how jQuery should treat the response when you are calling fetch:
yourCollection.fetch({
dataType: 'json'
});

Angular $resource PUT method, can't make it work

I use a REST api and I'd like to update on of my project objects with a PUT request. The request is supported in the API, and I'm trying to use $resource to PUT the data, but it doesn't seem to work. Here is what I do :
var projectResource = $resource('/api/projects/' + projectId, {update: {method: "PUT"}});
$scope.editProject = function(editedProject) {
projectResource.$update(editedProject);
}
Where editedProject is the project with the new values, filled by a form in a webpage. I know there is something wrong in my projectResource declaration, but I don't find what. Help !
Try this:
$resource('/api/projects', { id: projectId }, {
update: { method: 'PUT' }
});
$resource cannot make 'PUT' method, cuz of No 'Access-Control-Allow-Origin'. you can only found the 'OPTIONS' in the networks.In this case, you need to create your PUT call:
var data = $resource('someURL', { jobId: '#jobId'}, { 'update': { method:'PUT' }});
data.update(objectYouWannaUpdate);

parseJSON(response) is null

I have a Backbone model that is making a successful server request. The callback is using backbone's trigger method to trigger an event in the associated view, and its passing the parsed json response from the server request as the second parameter of the trigger method, as described in the backbone documents. In the view, the event triggers the render method, but the response object is null in the view. It's throwing this error
Uncaught TypeError: Cannot read property 'word' of null
Can anyone see what I might be doing wrong?
The server request from the model
new: function() {
var _this = this;
console.log("new function of model");
$.ajax({
url: "/gamestart",
type: "GET",
success: function(response) {
console.log(response);
var json = $.parseJSON(response);
_this.set({lost: false});
_this.set({win: false});
_this.trigger("gameStartedEvent", json);
}
})
},
the event in the initializer method of the view which triggers the render method to render the response
this.model.on("gameStartedEvent", this.render, this);
the render method where the response is null
render: function(response) {
$("#hint").show();
console.log(response);
var html = this.template({characters: response.word});
this.el.hide();
this.el.html(html).show();
},
Note, if it matters, the view is being instantiated with the model
var word_view = new WordView({model: game})
Update
Actually the error's happening here. The response is returning successfully but i'm parsing it incorrectly. The variable json is null when I check the console. Can you see what I'm doing wrong?
var json = $.parseJSON(response);
console.log(json)
Response
Object {word: Array[6]}
word: Array[6]
__proto__: Object
There was actually no need to call parseJSON on the response object. I could get the word property directly off the response object, so I just passed the response object as the second argument to trigger, and called response.word in the view.
$.ajax({
url: "/gamestart",
type: "GET",
success: function(response) {
console.log(response.word);
var json = $.parseJSON(response); ####unnecessary to parseJSON here
console.log(json);
_this.set({lost: false});
_this.set({win: false});
_this.trigger("gameStartedEvent", response);
}
})
},

How to create Backbone Collection from a JSON API call that returns root parameters as well as array

Backbone.js noob here.
I want to create a collection, from a JSON API external to my application. Specifically, the api from Stackoverflow. I know I should set the url parameter from a collection like this:
App.Collections.Users = Backbone.Collection.extend({
model: User,
url: "http://api.stackoverflow.com/1.1/users/800271;562692?jsonp=?&key=blahblah"
});
The problem is that the JSON API returns something like:
{
"total": 2,
"users": [
{
"user_id": 800271,
},
{
"user_id": 800272,
}
]
}
}
How do I ignore the "total" attribute?
If this is the only collection in your app to work with such api, all you have to do is to override parse method for it:
App.Collections.Users = Backbone.Collection.extend({
// ...
parse: function(resp, xhr) {
return resp.users
}
})
If you also have to save your models, maybe you will need to override Backbone.sync. Don't hesitate to read backbone's source: it's thoroughly annotated and easy to follow.

Resources