Autocomplete with remote data from function with callback


Topic: Autocomplete with remote data from function with callback

meesha81 pro premium priority asked 7 months ago

Hi, is anyone who can help me please?

From docs - async loading:

const asyncAutocomplete = document.querySelector('#async');
const asyncFilter = async (query) => {
  const url = `https://swapi.py4e.com/api/people/?search=${encodeURI(query)}`;
  const response = await fetch(url);
  const data = await response.json();
  return data.results;
};

new mdb.Autocomplete(asyncAutocomplete, {
  filter: asyncFilter,
  displayValue: (value) => value.name
});

But, we have api calls build with function which returns response to callback. Like:

apiCall(requestMethod, requestData, function(response) {
    #here I have data, which I am not able to use for autocomplete with remote data
});

Please, is any way, how to use this type of data request togethere with MDB autocomplete? I wouldn't like create URL wrapper to get data in the exactly same way.

Thank you.


meesha81 pro premium priority answered 7 months ago

In the past, we used some different select module (selectPicker) which has methods for changing data/update render etc. These type of methods I cannot see in documentation of autocomplete. So this is also question for MDB if is possible to change data and do update/render by methods.


Kamila Pieńkowska staff commented 7 months ago

Autocomplete do not have update method, but can be disposed and initiated with new data.


meesha81 pro premium priority answered 7 months ago

So I have solved it myself. Who need do this, you can do it with new promise wrapper function.

const response = await apiCallWrapper(request, requestData);

and apiCallWrapper looks like this

function apiCallWrapper(requestMethod, requestData) {
    return new Promise((resolve, reject) => {
        apiCall(requestMethod, requestData, function(response) {
            resolve(response);
        });
    });
}

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 7.3.0
  • Device: PC
  • Browser: Chrome
  • OS: Win11
  • Provided sample code: No
  • Provided link: No