Autocompletar un campo con JavaScript.

Es decir, si quisiese escribir una provincia, si escribiese la M, que me saliese todas las provincias que empiecen por M en una lista desplegable debajo del input text

2

2 Respuestas

25.600 pts. Llevo años en el mundo de la tecnología Web

La respuesta de Víctor es perfecta, pero en caso de que no quieras usar la librería de jQuery UI tienes varias opciones:

Incluso si no quieres depender de jQuery puedes trabajar con javascript puro y duro con librerías como https://github.com/Fischer-L/autoComplt  (muy simple, pero te puede valer).

54.430 pts. Desarrollador en Todoexpertos.com y Terminis.com (uno...

Existen múltiples plugins jQuery que permiten dar la funcionalidad de autocompletar a un input.

El más simple que conozco (y más extendido a la hora de buscar documentación) es el autocomplete de jQueryUI: https://jqueryui.com/autocomplete/

Tan solo has de referenciar a la librería de jQuery y jQueryUI, indicar el origen de datos (puede estar hardcoded en tu javascript o obtenerlo de una llamada ajax) e indicar cual es el input que debe mostrar los datos.

Un ejemplo:

Código HTML:

<input id="autocomplete" type="text" placeholder="Provincias">

Código JS:

var provincias = ["a coruna","alava","albacete","alicante","almeria","asturias","avila","badajoz","baleares","barcelona","burgos","caceres","cadiz","cantabria","castellon","ceuta","ciudad real","cordoba","cuenca","girona","granada","guadalajara","guipuzcoa","huelva","huesca","jaen","la rioja","las palmas","leon","lleida","lugo","madrid","malaga","melilla","murcia","navarra","ourense","palencia","pontevedra","salamanca","tenerife","segovia","sevilla","soria","tarragona","teruel","toledo","valencia","valladolid","vizcaya","zamora","zaragoza"];
 $("#autocomplete").autocomplete({
      source: provincias
    });

Como ves es muy sencillo. En la web de jQueryUI tienes mucha más documentación para conocer las distintas opciones de este plugin.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas