Bug select2 dropdown + search with x-editable

[mulatmar]

I click on the link. Popup opens with select. Click on select. The window is closed, select remains. I start typing text in the input field and select move to the top of the page.
https://monosnap.com/file/izwsEafdpS97aHnWuQeRXpu4CpxfRQ

[mlt]

This is addressed here #1151 look at line 84 of the very last file (src/containers/editable-container.js) #574 has a cleaner patch. I confirm this behavior on Chrome. Everything works as is with Firefox.

Also consider using select2 4.x . It has dropdownParent so it can be hooked into popover used by x-editable. I have the following in my coffee script

Object.assign $.fn.editabletypes.select2.defaults,
  tpl: '<select></select>'
  select2:
    dropdownParent: '.popover'
    width: '20em'
    dropdownAutoWidth: true
    theme: 'bootstrap'

[oawebdev]

For inline mode:
dropdownParent: '.editable-inline'

[umurkaragoz]

select2 : {
      dropdownParent   : '.popover:last',
  }

If you have multiple select2 editables, and you click another select2 editable while one is already opened, existing .popover will be selected for parent just before it is deleted, and dropdown position will be miscalculated. Since the new .popover is appended to the body, it always ends up after the previous one. Therefore the solution would be adding :last to the dropdownParent selector, so it would always select the new .popover.

[ilramdhan]

For those of you who are struggling to implement it on Bootstrap 4, maybe this can help.

For Bootstrap 4 its work, check this #1189 (comment)