Topic: mdb-select with web service supplied options that filter with typed search text
dnadeveloper priority asked 5 years ago
I need to provide a multiselect on a very large list of items. To do so, I was planning using the mdb-select and calling a service that would return a filtered set of data based on what a user is typing into the mdb-select search area. I’d like to know how I would hook into the search text and if the idea, as a whole, sounds doable using mdb-select. If there are any samples to the same, they would be greatly appreciated.
GADstudio pro answered 4 years ago
Hi,I tried to use @change event handler but I have some problems.
this is my code - in template:
<template>
<mdb-select ref="select" search :label="label" :placeholder="placeholder" :options="options" @search="onSearch" />
</template>
and my method:
onSearch(search) {
if (this.timer) {
clearTimeout(this.timer);
this.timer = null;
}
this.timer = setTimeout(this.search, 1000, search);
},
search(search) {
if (search != ''){
this.axios({
url: this.url + `/${search}`,
method: "get"
}).then(response => {
this.options = [];
response.data.forEach(item => {
let element = {text: item[this.description], value: item.id };
this.options.push(element);
});
console.log('options is ----------------',this.options)
});
}
},
when I write the first character in search input it works, but, if i wait a second and write a second character it immediately filter the option list (with old options list data) and when my method change options data the list become empty
thanks in advance
Davide
Magdalena Dembna staff commented 4 years ago
We will inspect this issue to improve this feature. Best regards, Magdalena
ozgehan premium answered 4 years ago
Are there any developments on this issue. I also need a server-side filtering option for long lists in mdb-select.
Thanks in advance,
Mikołaj Smoleński staff commented 4 years ago
Hi there,
It was just prepared and will be available from the next release (17.02.2020).
Best regards
Mikołaj Smoleński staff answered 5 years ago
Currently such options is not available, but I'm adding your issue to our list of important features. We'll be working on it soon. Thanks for reporting.
Best regards
dnadeveloper priority answered 5 years ago
Yes, we have a very long list of options and I would like to pull from the server a hundred options that start like what the user is typing in. I would essentially hit a web service upon every keystroke in the search box.
Mikołaj Smoleński staff answered 5 years ago
Hi there,
I'd like to make sure I understand correctly. You need to get the current value of search field in select in order to make a special request to your server?
Best regards
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Priority
- Premium support: Yes
- Technology: MDB Vue
- MDB Version: 5.8.1
- Device: desktop
- Browser: chrome
- OS: windows
- Provided sample code: No
- Provided link: No