Librería de autocompletado desarrollada con Javascript para Bootstrap 5.

Si deseas agregar la funcionalidad de autocompletado de datos en tus proyectos web desarrollados con la nueva versión de Bootstrap 5, sin la necesidad de tener que depender de jQuery; entonces esta publicación es para ti.

Esta librería de autocompletado desarrollada con JavaScript para Bootstrap 5, ha sido pensada para reemplazar la librería Autocomplete de jQuery, ya que no requiere de la instalación de otras librerías como lo es jQuery.

Librería de autocompletado desarrollada con Javascript para Bootstrap 5.

Descripción:
Esta es una versión mejorada del complemento Bootstrap 4 Autocomplete que permite una función de autocompletado / escritura anticipada ultrarrápida en la aplicaciones web desarrolladas con Bootstrap 5.

Cómo usarlo:
1. Crea un archivo llamado index.html y  carga los archivos llamados “autocompleteBS.css” y “autocompleteBS.js” en tu proyecto Bootstrap 5.

2. Crea un directorio llamado js y dentro de dicho directorio ve a crear un nuevo archivo llamado: “autocompleteBSDemo.js

3. En el directorio raíz crea un archivo llamado “paises.php”. Dicho archivo es el que se encargará de conectarse a la base de datos y buscar los registro que coincidan con los datos ingresados en el input de búsqueda

4- Creando nuestra base de datos. En el paso anterior se creó un archivo que hace una llamada a la base de datos, es por ello que se debe crear una base de datos, para este ejemplo la he nombrado test_autocomplete, pero tu puedes nombrarla como desees. Una vez creada la base de datos desde tu gestor de base de datos (phpMyAdmin), debes seleccionarla y ejecutar la siguiente consulta SQL.

Listo, ya tienes un ejemplo de autocompletado de datos para tus proyectos desarrollados con Bootstrap 5, cabe mencionar que no soy el creador de la librería: autocompleteBS.js, pero le he hecho algunas mejoras para poder usarlo con PHP + MySQL.

Visita el repositorio oficial de Github para más información y  para futuras actualizaciones. No olvides leer la licencia para usar este plugin en tus proyectos.