Backbone.js setting model with data from url

Question

I get data back from a url: /app/api/assetDetail/{id} where the id is a parameter passed to a presenter which sets up the new assetModel and assetView.

I'm struggling with where to build and call the above url with id and then set the model.

asset presenter

define([
    'text!html/regions/tplAssetPage.html',
    'views/assetView',
    'collections/assets',
    'models/asset'
],
function (template, AssetView, Assets, Asset) {
    return {
        load: function (params) {                   

            $(mv.sections.mainContainer).html(template);

            var view1 = 'assetView',
                id = params || '';

            this.model = new Asset({                    
                wid: params, //sets id on model
                url: function(){
                  var url =  'api/assetDetail/' + params;
                  return url;
                  }
            }); 
            mv.i.views[view1] = new AssetView({
                'el': '#asset-container',
                model: asset
            });
            mv.i.views[view1].setup();
        },
    };
});

asset model

define([], function () {
return Backbone.Model.extend({

    defaults: {
        id:''
    },

    initialize: function () {}

    });

});

asset view

define([
'text!html/tplAsset.html',
'models/asset'
], function (template, Asset) {

return Backbone.View.extend({

    el: '',

    template: _.template(template),

    initialize: function () {},

    render: function () {
        //var data = this.model.toJSON();
         this.$el.html(this.template(data));
    },

    setup: function () {
        var self = this;
        $.when(self.model.fetch())
            .done(function () {
                //console.log(self.model.toJSON());
                self.render();
            })
            .fail(function () {
                console.log('request for data has failed');
            });

              },

    events: {},
   });
});

now getting these errors: ERR: Routing error Error: A "url" property or function must be specified

at Backbone.View.extend.setup (/js/views/assetView.js:36:22)
   $.when(self.model.fetch())
at Object.load (/js/presenters/asset.js:34:23)
  mv.i.views[view1].setup();

Answer 1

To set the model url dynamically in your model instance:

 var asset = new Asset({                 
        wid: params, //sets id on model


        url: function(){
          var url = '/app/api/assetDetail/' + this.id;
          return url;
        }
  });

Then, after you have set the url, do asset.fetch()

Note that this will now be the URL for any communication with the server (save and fetch) for that model instance. If you need greater flexibiliy, you'll need to do adjust the Bacbkone sync method for your model.

UPDATE:

Once you've fetched the data you want for the model, you then can call the render function:

render: function () {
  this.$el.html( this.template(this.model.toJSON() ) );
  return this;
}

This will then render model data in your templates. If you're using the underscore templates it will look like: <p>some html<span> <%= data %> </span><p>

If you want to check what you have fetched, don't forget that fetch accepts success and error callbacks: http://backbonejs.org/#Model-fetch