jeudi 5 janvier 2017

Using Ember.$.ajax() to send data that has relationships

I'm running through a headache. I'm using Ember 2.0 (a bit old, I know...!). Due to the nature of the project (using ruby-on-rails) we have to use Ember,$.ajax() to manage the data instead of Ember-Data. We're trying to send a data object that has a relationship with another data model, but it throw an:

Uncaught TypeError: Cannot read property 'options' of undefined

Ember (controller):

import Ember from 'ember';

export default Ember.Controller.extend({
  sendFileData(url, verb, filetype, isSelected) {
    let controller = this;

    Ember.run.next(this, () => {
      Ember.$.ajax({
        url: url,
        type: verb,
        data: {
          title: controller.get('model.title'),
          files: Ember.A([
            controller.store.createRecord('file', {
              selected: isSelected,
              pdf: (filetype === 'pdf') ? 'pdf' : null,
              html: (filetype === 'html') ? 'html' : null
            })
          ])
        }
      }).then(() => {
        controller.set('successMessage', 'Pdf Data sent to backend!');
      }, () => {
        controller.set('successMessage', 'Something is wrong with PDF data!');
      });
      console.log('end sendFileData()!');
    });
  },

  actions: {

    exportData() {
      let controller = this,
        dataLink = controller.get('model.dataLink');

      console.log('Data link: ', dataLink);
      console.log('Model title: ', controller.get('model.title'));

      if (controller.get('isPdfChecked')) {
        console.log('PDF is chosen!');
        controller.sendFileData(dataLink, 'POST', 'pdf', controller.get('isPdfChecked'));
      }

      if (controller.get('isHtmlChecked')) {
        console.log('HTML is chosen!');
        controller.sendFileData(dataLink, 'POST', 'html', controller.get('isHtmlChecked'));
      }

      if (!controller.get('isPdfChecked') && !controller.get('isHtmlChecked')) {
        console.log('No options chosen!');
      }
    }
  }
});

Model:

// document model
import DS from 'ember-data';

export default DS.Model.extend({
  title: DS.attr('string'),
  content: DS.attr('string'),
  created_at: DS.attr('date'),
  start_at: DS.attr('utc'),
  end_at: DS.attr('utc'),
  user: DS.belongsTo('user', { async: true }),
  versions: DS.hasMany('version', { async: true }),
  files: DS.hasMany('file', { async: true }) // here's the relationship to file model
});


// file model
import Ember from 'ember';
import DS from 'ember-data';

export default DS.Model.extend({
  name: DS.attr('string'),
  url: DS.attr('string'),
  created_at: DS.attr('date'),
  document: DS.belongsTo('document', { async: true }), // here's the relationship to document model
  filetype: DS.attr('string'),
  selected: DS.attr('boolean'),
  pdf: DS.attr('boolean'),
  html: DS.attr('boolean')
});

Don't know what to do anymore :(... And we can't add the addon ember-data-save-relationships or similar, again because of how the project is structured.

Many thanks




Aucun commentaire:

Enregistrer un commentaire