Storing Data in Model & Call from Collection & Fetch

Question

Collection

define([
    'jquery',
    'underscore',
    'backbone'
], function($, _, Backbone){
    console.log("Loaded");

    var Jobs = Backbone.Collection.extend({
        url: function () {
            return 'http://domain.com/api/jobs?page='+this.page+''
        },
        page: 1
    });
    return Jobs;
});

Model

define([
    'underscore',
    'backbone'
], function(_, Backbone){
    var JobFilterModel = Backbone.Model.extend({
        defaults: {
            T: '1',  
            PT: '1',  
            C: '1',  
            I: '1'  
        }
    });
    // Return the model for the module
    return JobFilterModel;
});

In one of my view , i SET the models

 var jobListFilterModelUpdate = new JobListFilterModel();
            jobListFilterModelUpdate.set({value:isChecked});

I'm trying to retrieve the MODEL from Collection so i can send the correct QUERY with the URL.

Question 1

How do i retrieve from Model from Collection

Question 2

My Fetch is in Controller(List)View , I updated the Model of Filter with

  var jobListFilterModelUpdate = new JobListFilterModel();
            jobListFilterModelUpdate.set({value:isChecked});

Now the model has be updated, with the new set of data instead of the old default. of as above. What i'm asking is if i MANAGE to retrieve the data from model(the updated data) Will the data still be whatever i set from that Controller(List)View (at least for this "session")

Answer 1

This is going to be a long reply. Please bear with me.

Question 1

How do i retrieve from Model from Collection

You first need to update your Collection definition like this:

var Jobs = Backbone.Collection.extend({
        model: JobFilterModel, /*This was missing before.*/
        url: function () {
            return 'http://domain.com/api/jobs?page='+this.page+''
        },
        page: 1
    });

After that, you get your model from a collection object like this:

var job = jobs.get(110);

In the above code, 110 is the id of the model which you want. By now, it should be clear to you that all models should have an id attribute set by the server in the JSON response it sends.

Question 2

Will the retrieved collection be the updated Model with the data i Set in View?

What does it even mean for a collection to be a model? An apple can't be the apple tree or vice versa. Let me just say that this question is an oxymoron and then try to answer the real question bothering you.

You can either fetch one instance of a model from the server or you can get a whole bunch of them using an object of the collection. When you fetch models using a collection object, the data returned by the server is parsed and stored on the collection's models attribute. You can call collection.models to get the raw array of models but the preferred approach is to use collection.get .

On the other hand, when you create a model on the client side, it's an empty object. You can add attributes to it using set() . But this model object is still ephemeral and will go away when you leave the page in the browser. To persist its data, you need to call the save() method. save() uses sync() to persist the data to whatever datastore you want. By default, it will POST your data back to the server. By overriding the default behavior of sync() , you'll be able to save data to localStorage if you want.

One last thing, model instances created on the client side will not become part of a collection by default. You need to use the add() method of a collection object to add that model to the existing collection.

UPDATE to answer the questions in comments:

I updated Question 2 and i dont understand the 110 is the id of the model, my model doesnt send or receive any json. My controller does.

Yes, the controller has to encode your model as json and then send it back. You have to make sure that the returned json has an id property with some value. There is a way to customize which property will be used as the identity but let's not go there yet.

And ,if i GET after URL is being called, i cant pass the value into the URL :(

Okay, this is not clear to me. You'll have to clarify this further.