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