Vuetify: Text input event of select component
Hi there,
Would it be possible to emit an event when a user types in a select component using autocomplete? I noticed the latest version (0.13) emits an 'input' as well as a 'change' event but as far as I can tell these events are identical, just emitted from different places?
I have a potentially long list of items that a user needs to select from thus I preferably do not want to load the entire list when the parent component is mounted. Ideally I would load a server side filtered list after the user enters one character say for example an 'a'. This would already make the list to sort through on the frontend much shorter. From here the autocomplete part of the select component would manage the rest of the filtering, finally allowing the user to select the desired item.
So in a nutshell I want to be able to call a function (API in this case) when a user types in the select component. For my use case it would be used to update the items prop of the same select component but it could be used for other use cases.
ACalitz
All 5 comments
input event happens when the model changes at all. change only happens when that model change stems from a user taking an action.
A comparison would be, you have 2 selects that share a model, when you change 1, the other also updates its model, however, only the first will emit a change event because the second was not updated with a user action.
Does that make sense?
johnleider
on 4 Jul 2017
Yeah that makes perfect sense, thanks for pointing it out not sure how I missed that.
I think the main point of my question, however, has not come across. Would it be at all possible to emit the event caused by the user typing into the text field that makes up the select component? This way it would be possible to do API calls from within the select.
An example of this functionality can be see here: http://element.eleme.io/#/en-US/component/select#remote-search. The remote-search option specifically. While it is not exactly the same as my request it achieves the overall goal.
Any method of being able to call an API to populate the select would suffice. I am just trying to avoid doing it when the parent component is mounted in order to save on data transferred in the case where the list of items is really large.
BTW congratulations on v0.13 it looks awesome!
ACalitz
on 4 Jul 2017
We can look into this in the future.
johnleider
on 4 Jul 2017
I would also find this useful, for the exact same reasons as @ACalitz
dpfavand
on 10 Jul 2017
![lock[bot] picture](https://avatars1.githubusercontent.com/in/6672?v=4&s=40)
lock[bot]
Related issues
aaronjpitts
路
3Comments
chriswa
路
3Comments
smousa
路
3Comments
ricardovanlaarhoven
路
3Comments
sebastianmacias
路
3Comments
Most helpful comment
Yeah that makes perfect sense, thanks for pointing it out not sure how I missed that.
I think the main point of my question, however, has not come across. Would it be at all possible to emit the event caused by the user typing into the text field that makes up the select component? This way it would be possible to do API calls from within the select.
An example of this functionality can be see here: http://element.eleme.io/#/en-US/component/select#remote-search. The remote-search option specifically. While it is not exactly the same as my request it achieves the overall goal.
Any method of being able to call an API to populate the select would suffice. I am just trying to avoid doing it when the parent component is mounted in order to save on data transferred in the case where the list of items is really large.
BTW congratulations on v0.13 it looks awesome!