Backbone js: not fetch data from model when fetching data using rest api on collection
//Declare model
app.models.Items =Backbone.Model.extend({
defaults: {
id: '',
name : ''
}
});
//fetch data using collection
app.models.ItemsCollection = Backbone.Collection.extend({
model: app.models.Items,
url: urlprefix + id + "/items",
});
//Create Instance of Collection
app.models.ItemsModel = new app.models.ItemsCollection();
app.models.ItemsModel.fetch({
async: false,
// in success get response and add response in model
success: function(response) {
for (i = 0 ;i < response.models[0].attributes.elements.length;i++){
app.models.ItemsModel.add(new app.models.Items(response.models[0].attributes.elements[i]));
}
},
error: function (errorResponse) {
console.log(errorResponse);
}
});
In the controller, I have to set a new property in my model, but I don't have to get the model. in the console I tried item.models [0] to get the first model, but it shows me undefined.
var item = new app.models.Items();
item.set("Id", 'TG');
item.set("name", 'Gokul');
item.save(null, {
success: function(model, response){
console.log("save");
},
error: function(error, response){
console.log("Error: while saving Account data:" +JSON.stringify(error));
}
});
I am new to backbone.js so please help me. if i did something wrong in my code
source to share
There are several questions here:
-
There is no async: false option in the collection when calling fetch. When you call fetch (), an asynchronous call is made by the server to get the results. You don't want your browser to freeze when this happens.
-
You don't need to install separate models in a collection. Backbone does this for you if your REST endpoint is returning valid JSON.
I would get rid of the for loop in your success method. You don't need to do this.
Optionally, you can override the parsing parameter in the model definition to handle custom response processing for each model.
-
You also want to set urlRoot on the model definition so that you can use the model outside of the collection like you do.
-
Finally, it looks like you have the url property set incorrectly in your collection. You don't need an ID.
Told everyone that your code should look something like this:
app.models.Items =Backbone.Model.extend({
urlRoot: urlprefix + '/items',
defaults: {
id: '',
name : ''
},
parse: function(response, options) {
//your custom code here if necessary
}
});
app.models.ItemsCollection = Backbone.Collection.extend({
model: app.models.Items,
url: urlprefix + "/items",
});
What is it. Then you can create a collection and retrieve the current items:
var items = new app.models.ItemsCollection();
items.fetch();
But remember that fetch () is an asynchronous method. You need to wait for the results to return from the server before you can expect any items in the collection. This is a success option.
And now you can create the element independently as you can, and now that urlRoot is set on the model it should save your server correctly.
// Not sure you want to be setting the ID here in case you want it to
// be set on the server when it is persisted
var item = new app.models.Item({
"name": "Gokul"
});
item.save();
Then you can manually add the item to your collection:
items.add(item);
Or you can just put the items back again and it should be there now:
items.fetch();
Just remember again that fetch () will only work if you were expecting the item to be saved to the server (asynchronously).
Good luck!
source to share