Topic: mdbAutocomplete TypeAhead
Any chance to make mdbAutocomplete working with ajax produced data instead of javascript array, to make it similar to Typeahead Bootstrap 3 library.
I have tried to populate javascript array with new data every time user change input value but it looks really clumsy and will effect performance for sure.
Or another option, can I use typeahead with MD input and design it to work as good as autocomplete.
Hi Denzil,
You can always get your ajax call and convert the data to the table using jQuery. You need to keep in mind that ajax call is asynchronous and you have to wait for it to end before working with the data. You can use code similar to this:
$.ajax({
url: "/destination/",
type: "POST",
dataType: "json",
data: {
id: formId
}
})
.done(function( data ) {
// the data is ready
});
After you are certain that your data is ready simply just join the strings with .join(',')
If you need additional help I am here for you.
Best Regards, Piotr
Thanks Piotr,
That is exactly the problem, Ajax calls async, so this solutions will be slow, and clumsy.
If I was to use bootstrap typeahead, can I style mdb input to look the same as autocomplete?
Thanks.
MDBootstrap staff pro premium priority commented 5 years ago
What do you mean? The simple styling of the input to match autocomplete? Our both components have material designs ready to use. If you want to customize it feel free to modify our styles or simply add your own custom ones.
Denzil commented 5 years ago
Ideally I would like to use autocomplete same way we use Typeahead, with data pulled from ajax call. But if this is impossible, I would not mind to use typeahead js with simple mdb input but styling results to match input design.
MDBootstrap staff pro premium priority commented 5 years ago
I am afraid we are bonded to jQuery functionality and if this is not possible via jQuery.ajax() you would have to prepare this functionality on your own. Styling results to match input design is pretty straight forward. To achieve that you can set any given input value to match your data and display it this way.
Can I help you with something else? Piotr
Denzil commented 5 years ago
Thanks, looks like it. I'll try to style it.
MDBootstrap staff pro premium priority commented 5 years ago
Great, I close the topic.
Closed
This topic is closed.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Closed
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.8.10
- Device: Mac
- Browser: Chrome
- OS: MacOSX 10.14.6
- Provided sample code: No
- Provided link: No