search

vitalets / x-editable

In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
http://vitalets.github.io/x-editable
MIT License
6.51k stars 1.73k forks source link

Bug select2 dropdown + search with x-editable #1127

Open mulatmar opened 5 years ago

mulatmar commented 5 years ago

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 commented 4 years ago

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 commented 3 years ago

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

umurkaragoz commented 2 years ago 
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.