If value and text are exactly the same, dropdown clears out all other options on select

[gijsbeijer]

If the value of an option is exactly the same as the text and you select an option. On reopening the dropdown it only shows the selected option untill you click outside the element and reopen the dropdown again.

I'm expering this in Chrome (did not test other browsers). Also I am using the ModelSelect component

[birdspider]

having the same issue

since 909d8177e2428da40a2367c2790648d403d73e50 the searchText is coupled to the selected.value here ModelSelect.vue#L180.

This is only true if :value or v-model it a string and not a object.

Is this an intended change ? Why the difference between :values type

[igorski]

having the same issue This is only true if :value or v-model it a string and not a object.

I actually notice this (and I believe @gijsbeijer meant the same) on Objects too if the values for value and text are the same, e.g.:

For options with equal values for value and text

[ { value: 'foo', text: 'foo' }, { value: 'bar': text: 'bar' }

opening the select box after selecting one of the two values will only show one option (the one that was selected last).

For options with different values (notice uppercase first letter for text key):

[ { value: 'foo', text: 'Foo' }, { value: 'bar': text: 'Bar' }

this works fine (e.g. opening select box after selecting one of the two values will show all available options).

[mthottem]

Anyone have any success in fixing this issue?

[gijsbeijer]

Anyone have any success in fixing this issue?

Yes, by not using v-model, but setting it up manually by using a value prop and emitting an input event

[consciousnessdev]

Anyone have any success in fixing this issue?

Yes, by not using v-model, but setting it up manually by using a value prop and emitting an input event

Can yo describe it?

[gijsbeijer]

Anyone have any success in fixing this issue?

Yes, by not using v-model, but setting it up manually by using a value prop and emitting an input event

Can yo describe it?

Hi, I'm not able to give you an extensive description at the moment.

But what I basicaly did, was creating the v-model by hand. The v-model property is nothing more than shorthand for populating the value property and emitting an input event.

so in your component make sure you have a value prop this will recieve the value. then use an onchange (or any other event that changes the value) and $emit an input event with the changed value.

Sorry if it's a bit unclear but as I said I do not have a lot of time at the moment.

Let me know if this helped! Regards, Gijs