Search code examples
ember.jsember-dataember-addon

ember-power-select cannot type in it


I'm wondering if this is really an issue with ember-power-select, but I cannot type in it. The dropdown can be opened, but there is no display.

This is a template in which I call my component:

<div class="navbar-default sidebar" role="navigation">
  <div class="sidebar-nav navbar-collapse">
    <ul class="nav" id="side-menu">
     <li>
        {{global-search label=(t 'search')}}
     </li>
    </ul>
  </div>
</div>

And the template of my component:

{{#bs-form as |form|}}
  {{#form.element label=(t 'search')}}
      {{log allObjects}}
      {{#power-select
              selected=selected
              options=allObjects
              placeholder='test'
              onchange=(action (mut selected))
      as |name|
      }}
          {{name}}
      {{/power-select}}
  {{/form.element}}
{{/bs-form}}

And finally my components:

import Ember from 'ember';

export default Ember.Component.extend({
 allObjects: ['test', 'foo']
});

Solution

  • The answer is very simple. My power-select was hidden behind my other <li>. I just had to add this in my template in my power-select:

    renderInPlace=true