1

Boa noite, preciso de um código que ao digitar no input o usuário vai ver sugestões abaixo que deverão ser os valores puxados do banco.

<input type="text" id="pesquisa" name="pesquisa">

2 Respostas 2

1

Olá, algum tempo atrás tive a mesma duvida ... porém não queria usar as bibliotecas para fazer esse tipo de pesquisa, depois de um tempo na internet achei a biblioteca w3.js do site w3schools, e vi essa função de maneira muito simples
LINK:

0

Fiz algo similar assim

function pesquisa() {

    var substringMatcher = function (strs) {
        return function findMatches(q, cb) {
            var matches, substringRegex;

            // an array that will be populated with substring matches
            matches = [];

            // regex used to determine if a string contains the substring `q`
            substrRegex = new RegExp(q, 'i');

            // iterate through the pool of strings and for any string that
            // contains the substring `q`, add it to the `matches` array
            $.each(strs, function (i, str) {
                if (substrRegex.test(str)) {
                    matches.push(str);
                }
            });

            cb(matches);
        };
    };
    Getmateriasfromserver(function(a)    {
        var geral = a;
        var materias = geral[0];
        console.log(materias);

        $('#the-basics .typeahead').typeahead({
                hint: true,
                highlight: true,
                minLength: 1
            },
            {
                name: 'materias',
                source: substringMatcher(materias)
            });
    });
}
function fecharmodal()
{
    $('#portfolioModal2').modal('hide');
    $('#portfolioModal1').modal('hide');

}
function resgatevalor() {
    Getmateriasfromserver(function(a)    {
    var form = document.getElementById('formulario');

    form.addEventListener('submit', function(e) {
    var i_aux;

            var campo = document.getElementById('barra-pesquisa').value;
            var geral = a;
            var nome_aux = geral[0];
            for(var i=0;i<nome_aux.length;i++){
                if(campo === nome_aux[i])
                {
                    i_aux = i;
                }
            }
            // alerta o valor do campo
            var codigo = geral[3];
            var prof = geral[2];
            var dias = geral[4];
            var horario = geral[6];
            var vagas = geral[1];
            var local = geral[5];

            $('#modalResultado').modal('show');
            $('#modalResultado').find('.principal').text(campo + " :");
            $('#modalResultado').find('.codigo').text("Código- " + codigo[i_aux]);
            $('#modalResultado').find('.prof').text("Professor: " + prof[i_aux]);
            $('#modalResultado').find('.dias').text("Dias: " + dias[i_aux]);
            $('#modalResultado').find('.horario').text("Horário: " + horario[i_aux]);
            $('#modalResultado').find('.vagas').text("Vagas: " + vagas[i_aux]);
            $('#modalResultado').find('.local').text("Local: " + local[i_aux]);


            e.preventDefault();

        });
    });
}

esse site explica bem: http://codigofonte.uol.com.br/codigos/funcao-autocompletar-com-jquery-php-e-banco-de-dados

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .