silvrgit/app/js/modules/train.js

/**
 *
 * User: Martin Donnelly
 * Date: 2016-10-03
 * Time: 14:20
 *
 */

let TrainModel = Backbone.Model.extend({
  initialize: function() {
      console.log(this.get('to'));
      let fromStation = this.get('from');
      let toStation = this.get('to');
      let url = '/getnexttraintimes?from=' + fromStation + '&to=' + toStation;
      let target = fromStation + toStation;
      this.set('url', url);
      this.set('target', target);
      this.update();
    }, update: function() {
      this.getTrain();
    },
    getTrain: function() {
        let url = this.get('url');
        let self = this;
        console.log(url);
        $.ajax({
              type: 'GET',
              url: url,
              data: '',
              dataType: 'json',
              timeout: 10000,
              headers: {
                'Access-Control-Allow-Origin': '*',
                'Access-Control-Allow-Methods': 'PUT, GET, POST, DELETE, OPTIONS',
                'Access-Control-Allow-Headers': 'Content-Type'
              },
              success: function(data) {
                console.log(data);
                self.set('trainData', data);
              },
              error: function(xhr, type) {
                console.log('ajax error');
                console.log(xhr);
                console.log(type);
              }
            });
    }
});

let Train = Backbone.View.extend({
  tagName: 'div',
  initialize: function() {
    _.bindAll(this, 'render');
    this.model.bind('change', this.render);
    this.$traininfo = $('#traininfo');
    this.$traintext = $('#traintext');
  },
  render: function() {
    console.log('Train:Render');
    let ws = '';
    let data = this.model.get('data');
    console.log(this.model);

    if (data.length > 0)    {
      for (let i = 0; i < data.length; i++)      {
        ws = ws + '<div class="mui-row"><div class="mui-col-md-12"><strong>' + data[i].title + '</strong></div></div>';
        ws = ws + '<div class="mui-row"><div class="mui-col-md-12">' + data[i].description + '</div></div>';
      }

      this.$traintext.empty().html(ws);
      this.$traininfo.removeClass('mui--hide').addClass('mui--show');
    } else {
      this.$traininfo.removeClass('mui--show').addClass('mui--hide');
    }
  }

});