Search code examples
ember.jsember-datadisplay

Issue with ember-power-select, wrong display, but good data


I have a small issue with ember-power-select. In a form, I want to set a value to either Logical or Physical, so I decided to use ember-power-select. It work correctly, but when I change the value on the form with ember-power-select, the display is still the same, by that I mean that I stay on Logical, even if the value is Physical.
Here is the template:

{{#form.element label=(t 'type')}}
  {{#power-select
    selected=selectedType
    searchEnabled=false
    options=allType
    onchange=(action (mut zone.type))
    placeholder=(t 'type_zone')
    as |type|}}
  {{/power-select}}
{{/form.element}}

And here is the component:

allType: ['Logical', 'Physical'],
selectedType: 'Logical'

And the model:

type: DS.attr('string')

Everything related to this power-select is here.

Solution

  • selected=selected change this to selected=selectedType.

    you need to provide selectedType as selected for maintaining the selected properties.

    Try this, we removed selectedType and used zone.type as selected type.

    selected=zone.type and onchange=(action (mut zone.type)) Here onchange action will set the selected value to zone.type. so you need to have selected=zone.type only then selected changes will persist.