how backbone.js model fetch method works -

i confuse using backbone.js model fetch method. see following example
backbone router:

profile: function(id) {   var model = new account({id:id});   console.log("<---------profile router-------->");   this.changeview(new profileview({model:model}));   model.fetch(); }   

the first step, model account instantiated, account model looks this.

define(['models/statuscollection'], function(statuscollection) {   var account = backbone.model.extend({     urlroot: '/accounts',      initialize: function() {       this.status       = new statuscollection();       this.status.url   = '/accounts/' + this.id + '/status';       this.activity     = new statuscollection();       this.activity.url = '/accounts/' + this.id + '/activity';     }   });    return account; }); 

urlroot property it? after model object created, profileview rendered this.changeview(new profileview({model:model}));, changeview function looks this.

changeview: function(view) {   if ( null != this.currentview ) {     this.currentview.undelegateevents();   }   this.currentview = view;   this.currentview.render(); }, 

after render view, profile information not display yet, after model.fetch(); statement execute, data model displayed, why? don't know how fetch works, try find out, no chance.

i'm not entirely sure question here, best explain can.

the concept behind urlroot base url , child elements fetched below id added urlroot.

for example, following code:

var account = backbone.model.extend({     urlroot: '/accounts' }); 

will set base url. if instantiate , call fetch():

var anaccount = new account({id: 'abcd1234'}); anaccount.fetch(); 

it make following request:

get /accounts/abcd1234 

in case there, setting urlroot , explicitly setting url urlroot provided ignored.

i encourage backbone source (it's surprisingly succinct) see how url derived: http://backbonejs.org/docs/backbone.html#section-65

to answer other question, reason profile information not display fetch() goes out network, goes server, , has wait reply before can displayed.

this not instant.

it done in non-blocking fashion, meaning make request, continue on doing it's doing, , when request comes server, fires event backbone uses make sure else had done, have model's data, done.

i've put comments in snippet explain what's going on here:

profile: function(id) {   // instantiating model, giving id passed argument   var model = new account({id:id});   console.log("<---------profile router-------->");    // instantiating new view fresh model, data has    // not yet been fetched view not display   this.changeview(new profileview({model:model}));    // fetching data here. little while while request goes   // browser, on network, hits server, gets response. after   // getting response, fire 'sync' event view can use   // re-render model has data.   model.fetch(); } 

so if want ensure view updated after model has been fetched there few ways can that: (1) pass success callback model.fetch() (2) register handler on view watches 'sync' event, re-renders view when returns (3) put code instantiating view in success callback, way view won't created until after network request returns , model has data.