Values in a field with type select only sortable if autocomplete: false

[mcdennem]

In the Bolt docs (https://docs.boltcms.io/5.0/fields/select#making-the-selected-values-sortable), the way to make values in a select sortable is described as:

somevalue:
     type: select
     values: programme/{title}
     sort: name
     autocomplete: true
     limit: 1000

But with autocomplete: true that doesn't work. You have to set autocomplete: false to drag and drop the values in the CMS:

Details

Question	Answer
Relevant Bolt Version	5.06
Install type	Composer install
PHP version	7.3
Web server	Built-in, version (Symfony)

Reproduction

Steps to reproduce

I created an select type field as described in https://docs.boltcms.io/5.0/fields/select#making-the-selected-values-sortable

 portfolio:
    type: select
    label: Portfolio Items
    values: portfolio/{id},{title}
    multiple: true
    autocomplete: true
    sortable: true
    localize: true

Expected result

I expect the select values to be sortable as drag and drop.

Actual result

I was not able to sort the values in the select by drag and drop.

[I-Valchev]

Thanks for the detailed issue, @mcdennem !

Digging into this, I don't think we're able to fix it properly. The issue is that when vue multiselect's searchable: true is set, it handles all events in the .multiselect__tags-wrap container. And it does not propagate further down to our span elements. The tricky part is also that https://github.com/shentao/vue-multiselect hasn't had a release in over two years...

So, the only option I can think of is to look into it again when/after upgrading to vue 3...

[bobdenotter]

I'm bumping this to milestone 5.2, for now

[I-Valchev]

Cool, perhaps this is fixable with #2842

[jovuk]

Well weird thing is that autocomplete:true AND drag and drop work fine on FIrefox but not with Chrome. Any idea why ?

[jordanaubert]

Well weird thing is that autocomplete:true AND drag and drop work fine on FIrefox but not with Chrome. Any idea why ?

linked issue : #2902