Quiero hacer un input "autocomplete" aquí:
<div id="wrap-search">
<div class="search">
<h2>Busca Destinos</h2>
<input id="form-autocomplete" class="form-control mdb-autocomplete" type="text" placeholder=" Alaska, Nueva Zelanda, California...">
</div>
</div>
Nunca he usado jQuery pero he visto en un articulo en un blog que simplemente usando Bootstrap y jQuery con poner este código ya debería funcionar:
$(document).on('focus', '#idLocalNames', function () {
var list = [
"Test",
"Test 2",
"Test 4",
"Example 1",
"Example 2"
];
$(this).autocomplete({
//source take a list of data
source: list,
minLength: 1//min = 2 characters
});
});
Sin embargo no funciona nada, creo que es porque no tengo claro como colocar los CDN, ahora mismo lo tengo así:
al final del body:
<script src="main.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
y arriba
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" media="screen" href="main.css">
</head>
He añadido sobre eso los "scripts" de jQuery con la misma estrategia que los de Bootstrap, pero no funciona. De hecho, acaso los de Bootstrap no llevan ya "integrado" jQuery? Que links exactamente tengo que hacer referencia para que esto funcione?
bootstrap.js
. Segundo, te falta hacer uso de jQuery UI, que es una biblioteca para el framework jQuery. Puedes ver su CDN aquí – Jheyman Mejia el 20 feb. 19 a las 13:27