1

Criei uma input text e através do jQuery estou fazendo um autocomplete, consegui fazer funcionar colocando dados locais, como faço para mostrar os dados de uma API gerada como localhost. Não estou sabendo fazer como trocar isso.

Segue meu código:

<!-- Importado os arquivos do Jquery -->
<link rel="stylesheet" 
href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<!-- Criando um input que receberá o autocomplete -->
<input type="text" id="fruta" placeholder="Informe uma fruta"/>

<!-- Meu código Jquery em um arquivo que chamei de fruta.js -->
<script>
   $(function() {
       var frutas = ["Ameixa", "Amora", "Banana", "Uva", "Maça"];
       $("#fruta" ).autocomplete({
           source: frutas
   });
});
</script>

Como disse, ele funciona pegando as informações localmente. Estou procurando e não encontro nada parecido com minha situação.

Agora eu preciso trocar para que ele pegue informações dessa API criada: http://localhost:5000/frutas

Como posso fazer essa troca ?

1 Resposta 1

-2

Você pode fazer uma requisição Ajax para a sua API. O que vai acontecer é o seguinte: O ajax vai enviar uma requisição pra sua API assincronamente e após algum tempo vai obter a resposta da sua API, enquanto que o resto do seu código vai continuar executando.

Se a resposta da sua API for texto, minha recomendação é que você estruture a resposta da sua API usando algum formato conhecido como JSON, XML, e etc....

Quando você obter a resposta, basta inserir seu código de autocompletar com os dados que sua API deu.

4
  • 1
    Bom dia Samuel. Obrigado pela reposta. Vou pesquisar como fazer isso. Sou novo em jQuery e não tenho a mínima ideia como fazer. rsrsrsrs Commented 6/09/2021 às 14:39
  • clica nesse link que coloquei na resposta que ele abre um site com várias informações sobre
    – Samuel
    Commented 6/09/2021 às 23:10
  • 1
    obrigado Samuel. Consegui fazer. Commented 9/09/2021 às 16:51
  • Poste aqui como vc conseguiu fazer, vai ajudar outras pessoas
    – d3roch4
    Commented 28/07/2022 às 18:34

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 .