Autocomplete mdboostrap stop working when typing to rapidly


Topic: Autocomplete mdboostrap stop working when typing to rapidly or with starting with a space

Kiril asked 3 years ago

Expected behavior Auto complete to keep working when typing space a te the beginning

Actual behavior Au complete stop functionning, the dropdown no longer opens even if the backend is called dans the array is filled up

Resources (screenshots, code snippets etc.)

Here is the sample code used

function InitModalMailAutoComplete() {

//Promise pour aller chercher les courriels de l'autocomplete
const asyncFilter = async (query) => {

    var results = [];

    //Si on est vide on retourne un tableau vide
    if (commonLib.isNullOrEmpty(query)) {
        return results;
    }

    await axios.get(`/api/user/search/active/directory?email=${encodeURI(query)}`).then(function (response) {
        let mailsFound = response.data || [];
        //Assignation des propriétés de l'AD au résultats
        if (mailsFound.length > 0) {
            $.each(mailsFound, function () {
                results.push({
                    email: this.properties?.mail?.toString(),
                    nom: this.properties?.sn?.toString(),
                    prenom: this.properties?.givenName?.toString(),
                    login: this.properties?.samAccountName?.toString()
                });
            });
        }
    })
    .catch(function (error) {
        toastr.error(Labels.Current.ERRRecuperationDonnesEnEchec);
    });

    return results;
};
//Instance du champ courriel
const asyncAutocomplete = $(ADMIN_USER_MODAL_MAIL)[0];
//Active le composant autocomple de MDB
mdbMail = new mdb.Autocomplete(asyncAutocomplete, {
    filter: asyncFilter,
    threshold: 3,
    displayValue: (value) => value?.email || ""
});

mdbMail._options.noResults = Labels.Current.DTNET_Language_NoEntryFound;

//On rempli les champs du modal d'ajout quand l'utilisateur a choisi un courriel dans la liste
$(ADMIN_USER_MODAL_MAIL).on('itemSelect.mdb.autocomplete', function (e) {
    $(ADMIN_USER_MODAL_LOGIN).val(e.value.login).focus();
    $(ADMIN_USER_MODAL_PRENOM).val(e.value.prenom).focus();
    $(ADMIN_USER_MODAL_NOM).val(e.value.nom).focus();
});

}


Grzegorz Bujański staff answered 3 years ago

Unfortunately I am unable to reproduce this error. Please create a snippet in which this error will occur. We'll check what's going on.


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: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: MDB5 4.0.0
  • Device: pc
  • Browser: CHROME
  • OS: windows 10
  • Provided sample code: No
  • Provided link: No
Tags