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 ?