mardi 20 février 2018

Update textarea model in Emberjs

I have a component which contains a switch and a yielded form. The switch changes the model used for the yielded form. In the said form, I have a textarea whose value comes from the model. When I update the model in the component, the textarea is bent to the correct model but the value inside it doesn't update. I can't figure out how to do it

Here is my component:

import Ember from 'ember';

const { computed } = Ember;

export default Ember.Component.extend({
  // Properties
  switchField: null,
  defaultModel: null,
  specificModel: null,

  activeModel: computed('switchField', 'defaultModel', 'specificModel', function() {
    if (this.get('switchField')) {
      return this.get('defaultModel');
    } else {
      return this.get('specificModel');
    }
  }),

  editDisabled: computed('switchField', function() {
    if (this.get('switchField')) {
      return true;
    } else {
      return false;
    }
  }),

  renderSwitch: function() {
    Ember.run.schedule('afterRender', this, function() {
      $('.toggle-switch').bootstrapToggle();
    });
  }.on('init'),

  actions: {
    reflectChange: function(value) {
      this.set('switchField', value);
      this.rerender();
    }
  }
});

The template:

<div class="col-xs-12">
  <input data-toggle="toggle" data-onstyle="success" data-offstyle="danger" class="toggle-switch" type="checkbox" checked= onchange= />
  <br>
  <br>
</div>



And how it is used:


  <div class="col-xs-12">
    
      <label class="control-label" for="carrierProcedure">Procédure coursier</label>
      
    
  </div>


I tried to rerender the component but it doesn't work. I don't understand why the value doesn't change since the textarea gets correctly enabled/disabled when I toggle the switch.

Thanks for your help.




Aucun commentaire:

Enregistrer un commentaire