• User

    Bootstrap typeahead e la funzione abort()

    Ciao a tutti, sto cominciando ora ad utilizzare bootstrap e grazie all'aiuto ricevuto in questo form sono riuscito a sfruttare la funzione Typeahead per il l'autocompletamento di alcuni campi di un form. A questo punto però i problema si è rivelato un altro... assia la lentezza nella risposta. Il perchè è presto detto per ogni campo che ha l'autocompletamento typeahead ogni volta che digito faccio fare una ricerca nel db. Quindi, se devo cercare "Edoardo" e digito "e" mi fa la ricerca nel campo nome cercando e ma se io digito velocemente "ed" lui aspetta di finire la prima ricerca e poi mi fa la successiva e così via e se quindi io digito velocemente il nome devo aspettare un bel po' di tempo prima che io possa avere i risutati della ricerca che mi interessa. A questo punto ho pensato che ad ogni inserimento di una nuova lettera dovrebbe interrompermi tutte le richieste precedenti immediatamente e farmi solo l'ultima e credo che la funzione che fa al caso mio è abort(). (si accettano suggerimenti :smile5:) Il problema è che non sono dove metterlo e come utilizzarlo visto che ognimio tentativo non ha sortito effetto o alla peggio a fatto smettere di funzionare tutto... Qualcuno sa come aiutarmi? Spero di essere stato chiaro nello spiegare il mio problema di posto il codice che mi svolge le ricerche ma lentissime :crying: grazie a tutti e spero che almeno il codice qui sotto possa servire a qualcuno. Premetto che l'ho trovato in un forum e l'ho adattato anche se alcuni passaggi mi sfuggono. Magari se qualcuno si offre mi farei dare dei chiarimenti. Ciao:ciauz:

    
    $('#inputNome').typeahead({
                minLength: 2,
                source: function (query, process) {
                    return $.ajax({
                        url: "pages/ajaxPedigree.php",
                        type: 'post',
                        data: { "act": "search_m" , name: query },
                        dataType: 'json',
                        success: function (result) {
                            var resultList = result.map(function (item) {
                                var aItem = { idC: item.idC, nC: item.nC };
                                return JSON.stringify(aItem);
                            });
    
                            return process(resultList);
    
                        }
                    });
                },
    
                matcher: function (obj) {
                    var item = JSON.parse(obj);
                    return ~item.nC.toLowerCase().indexOf(this.query.toLowerCase())
                },
    
                sorter: function (items) {          
                    var beginswith = [], caseSensitive = [], caseInsensitive = [], item;
                    while (aItem = items.shift()) {
                        var item = JSON.parse(aItem);
                        if (!item.nC.toLowerCase().indexOf(this.query.toLowerCase())) beginswith.push(JSON.stringify(item));
                        else if (~item.nC.indexOf(this.query)) caseSensitive.push(JSON.stringify(item));
                        else caseInsensitive.push(JSON.stringify(item));
                    }
    
                    return beginswith.concat(caseSensitive, caseInsensitive)
    
                },
    
                highlighter: function (obj) {
                    var item = JSON.parse(obj);
                    var query = this.query.replace(/[\-[]{}()*+?.,\\\^$|#\s]/g, '\\$&')
                    return item.nC.replace(new RegExp('(' + query + ')', 'ig'), function ($1, match) {
                        return '<strong>' + match + '</strong>'
                    })
                },
                
                updater: function (obj) {
                    var item = JSON.parse(obj);
                    $('#id_nome').attr('value', item.idC);
                    
                    return item.nC;
                }
            });