0

Estou desenvolvendo um app e, em uma das etapas, estou usando um banco de dados mySQL para armazenar código e e informações dos produtos. Quando o usuário digita o código do produto em um campo input, ele esta buscando em todo o código, mas gostaria que ele buscasse exatamente conforme o usuário digita, exemplo:

• Se o usuario digitar "casa"

•Exibir casamento, casório e etc.

• E não acasalamento, etc.

O segundo problema é que preciso que as demais informações do produto apareção em campos input designados por id, mas também não esta indo.

HTML Selecione o produto:

        <div id="infoProd"></div>
        <p><span class="labelFake">Codigo do produto:</span><input type="text" id="codigoItem" disabled></p>
        <p><span class="labelFake">Descrição:</span><input type="text" id="descricao" disabled></p>
        <p><span class="labelFake">Alíquota de IPI:</span><input type="text" id="aliqIPI" disabled></p>

php para a conectar o banco de dados e retornar os dados em json

            // Recebe os parâmetros enviados via GET
            $acao = (isset($_GET['acao'])) ? $_GET['acao'] : '';
            $parametro = (isset($_GET['parametro'])) ? $_GET['parametro'] : '';

            // Configura uma conexão com o banco de dados
            $opcoes = array(PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES UTF8');
            $conexao = new PDO("mysql:host=".SERVER."; dbname=".DBNAME, USER, PASSWORD, $opcoes);

            // Verifica se foi solicitado uma consulta para o autocomplete
            if($acao == 'autocomplete'):
                $where = (!empty($parametro)) ? 'WHERE codigo_item LIKE ?' : '';
            $sql = "SELECT codigo_item, descricao_item, aliq_ipi FROM base_prod " . $where;

            $stm = $conexao->prepare($sql);
            $stm->bindValue(1, '%'.$parametro.'%');
            $stm->execute();
            $dados = $stm->fetchAll(PDO::FETCH_OBJ);

            $json = json_encode($dados);
            echo $json;
            endif;

            // Verifica se foi solicitado uma consulta para preencher os campos do formulário
            if($acao == 'consulta'):
                $sql = "SELECT codigo_item, descricao_item, aliq_ipi FROM base_prod ";
            $sql .= "WHERE codigo_item LIKE ? LIMIT 1";

            $stm = $conexao->prepare($sql);
            $stm->bindValue(1, $parametro.'%');
            $stm->execute();
            $dados = $stm->fetchAll(PDO::FETCH_OBJ);

            $json = json_encode($dados);
            echo $json;
            endif;

e o javascript que usei

$(function() { // Atribui evento e função para limpeza dos campos $('#busca').on('input', limpaCampos);

                // Dispara o Autocomplete a partir do segundo caracter
                $( "#busca" ).autocomplete({
                    minLength: 2,
                    source: function( request, response ) {
                        $.ajax({
                            url: "consulta.php",
                            dataType: "json",
                            data: {
                                acao: 'autocomplete',
                                parametro: $('#busca').val()
                            },
                            success: function(data) {
                                response(data);
                            }
                        });
                    },
                    focus: function( event, ui ) {
                        $("#busca").val( ui.item.codigo_item );
                        carregarDados();
                        return false;
                    },
                    select: function( event, ui ) {
                        $("#busca").val( ui.item.codigo_item );
                        return false;
                    }
                })
                .autocomplete( "instance" )._renderItem = function( ul, item ) {
                    return $( "<li>" )
                    .append( item.codigo_item+ " — " + item.descricao_item )
                    .appendTo( ul );
                };

                // Função para carregar os dados da consulta nos respectivos campos
                function carregarDados(){
                    var busca = $('#busca').val();

                    if(busca != "" && busca.length >= 2){
                        $.ajax({
                            url: "consulta.php",
                            dataType: "json",   
                            data: {
                                acao: 'consulta',
                                parametro: $('#busca').val()
                            },
                            success: function( data ) {
                                $('#codigoItem').val(data[0].codigo_item);
                                $('#descricao').val(data[0].descricao_item);
                                $('#aliqIPI').val(data[0].aliq_ipi);
                            }
                        });
                    }
                }

                // Função para limpar os campos caso a busca esteja vazia

                function limpaCampos(){
                    var busca = $('#busca').val();
                    if(busca == ""){
                        $('#codigoItem').value('');
                        $('#busca').val('');
                        $('#descricao').val('')
                        $('#aliqIPI').val('');

                    }
                }
            });
4
  • 1
    Se não quer que palavras com a busca no "centro" sejam retorandas. Deve retirar o primeiro % do $stm->bindValue(1, $parametro.'%');. Se quer que retorne apenas palavras associadas, vai ter que fazer com que as palavras apontem para aquelas que tem relação.
    – mau humor
    Commented 14/01/2017 às 1:54
  • Yay, funcionou perfeitamente, obrigado @mauhumor, agora só preciso colocar os campos retornados nos inputs :/ Commented 14/01/2017 às 2:13
  • Qual autocomplete você está utilizando? qual lib?
    – mau humor
    Commented 14/01/2017 às 2:58
  • vê a resposta..
    – mau humor
    Commented 14/01/2017 às 3:09

1 Resposta 1

3

Primeira duvida. Para retornar palavras que comecem com a busca, você não deve utilizar o caractere curinga % no inicio, pois se fizer isso, vai "dizer" para o MySQL que você não se "importa" com o que a palavra inicia, desde que a busca apareça em alguma parte dela. O % no fim indica que você não se importa como a palavra termina. Parece que é esse teu caso. Então, você deve remover o primeiro %.

$stm->bindValue(1, $parametro.'%');

A segunda duvida. Não sei qual lib você está utilizando para esse autocompletar. Mas analisando o código, imagino que no evento disparado quando um valor é selecionado, você tem acesso aos outros dados do registro. Então, utilizando JavaScript ou a lib jQuery, você pode atribuir esses valores aos elementos dessa forma:

...
select: function( event, ui ) {
  $("#codigoItem").val(ui.item.codigo_item);
  $("#descricao").val(ui.item.descricao_item);
  $("#aliqIPI").val(ui.item.aliq_ipi);
  //Código original, não sei para que serve.
  $("#busca").val( ui.item.codigo_item );
  return false;
}
....
4
  • Yes! O código funcionou, e sim, a lib era a jQuery, porém por mais que eu tenha lido, não entendi o segundo código, se importaria em me explicar ? Commented 14/01/2017 às 3:37
  • Aqui $("#codigoItem") eu referencio o elemento pelo id que você colocou lá no HTML: id="codigoItem". o método ".val()" passa um valor para inserir no atributo value="". Assim com jQuery você pode pegar um campo e inserir um valor. Procura um tutorial do jQuery, vai te ajudar bastante :D.
    – mau humor
    Commented 14/01/2017 às 4:18
  • ui.item contem o registro que você pegou do banco de dados. basta chamar a propriedade.
    – mau humor
    Commented 14/01/2017 às 4:20
  • 1
    Mau humor é só o nick, porque você é demais, hahahaha Commented 14/01/2017 às 13:06

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 .