Topic: Autocomplete with API return error when click outside without value

METOURNEAU free asked 2 years ago

Click in and then out the search input whithout writing anything generate error : Uncaught TypeError: Cannot read properties of null (reading 'classList').

const asyncAutocomplete = document.querySelector('#autocomplete');
const asyncFilter = async (query) => {
    if(query == ""){
      return [];
    const url = url + `${encodeURI(query)}`;
    const response = await fetch(url);
    const data = await response.json();
    return data;

  new mdb.Autocomplete(asyncAutocomplete, {
    filter: asyncFilter,
    displayValue: (value) => value.val,
    noResults: "No result"

  asyncAutocomplete.addEventListener('itemSelect.mdb.autocomplete', (e) => {
    //select value


Dawid Wajszczuk staff commented 2 years ago

Hi. Can you recreate this error in a snippet Because in mine everything looks fine

METOURNEAU free commented 2 years ago

My bad, I forget the label in the form-outline. Thanks for support

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: MDB5 3.10.1
  • Device: computer
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No