Deprecated: Function create_function() is deprecated in /var/www/vhosts/eduardoarellano.com/d4mations.com/wp-content/plugins/wp-automatic/wp-automatic.php on line 70
Buscador en tiempo real con Javascript utilizando indexOf y Bootstrap 4. | D4mations.com
  • Friday , 4 December 2020

Buscador en tiempo real con Javascript utilizando indexOf y Bootstrap 4.

Code Canyon
https://i.ytimg.com/vi/NduleX-AC74/hqdefault.jpg



Curso Vue 2 + Firebase: http://curso-vue-js-udemy.bluuweb.cl

Hoy realizaremos una práctica utilizando vainilla Javascript, creando un rápido buscador en tiempo real para tus datos.

Documentación https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/indexOf

Suscríbete aquí: https://www.youtube.com/bluuweb
Descarga los archivos del curso aquí: https://goo.gl/4tZAZb

MÁS CURSOS DE BLUUWEB!
📌 HTML Y CSS: https://goo.gl/yoMdMZ
📌 JAVASCRIPT: https://goo.gl/hnQkog
📌 JQUERY: https://goo.gl/Ag7XsG
📌 CSS GRID: https://goo.gl/nR56pT
📌 VISUAL STUDIO CODE: https://goo.gl/cvu57R
📌 BOOTSTRAP 4: https://goo.gl/npezrj
📌 PHOTOSHOP: https://goo.gl/1C9k5n
📌 PSD A HTML: https://goo.gl/VYX2V6
📌 TEMAS WORDPRESS: https://goo.gl/GeiVNm
📌 PHP Y MYSQL: https://goo.gl/oao1QT
📌 FORMULARIOS CON PHP Y AJAX: https://goo.gl/GKpZAH
📌 ANGULAR: https://goo.gl/WJhtnC
📌 VUE.JS: https://goo.gl/QzLoFY
📌 FIREBASE/FIRESTORE: https://goo.gl/bpKL9i
📌 PHP LARAVEL: https://goo.gl/iAbPBy
📌 MATERIALIZE CSS: https://goo.gl/7pSFY5
📌 IONIC: https://goo.gl/RNGKTD
📌 SASS: https://goo.gl/ba7mEE
📌 PROGRAMACIÓN BÁSICA: https://goo.gl/HksyVi

¿Quiéres apoyar el canal?
Curso de Bootstrap 4 PREMIUM!
Accede con un súper descuento aquí:
curso-bootstrap-4-udemy.bluuweb.cl

También puedes seguirme en Facebook: https://www.facebook.com/bluuweb/

Finalmente visita mi sitio web: https://www.bluuweb.org

Original source

3d Ocean

Related Posts

32 Comments

  1. Jeanth Uzcategui
    April 7, 2020 at 18:09

    Hola si quiero que muestre la imagen asociada al producto se puede?

  2. Mary Company
    April 7, 2020 at 18:09

    se podria hacer el buscador en tiempo real diretamente con firebase?

  3. Manuel Gonzalez
    April 7, 2020 at 18:09

    me salvaste la vida locoooo xD gracias ! like!

  4. Salvax ツ
    April 7, 2020 at 18:09

    como se hacen esas comillas?

  5. Facundo Delgado
    April 7, 2020 at 18:09

    me gustaria que fasilitaras el codigo q se muestra en el video.

  6. Annie Tibbers
    April 7, 2020 at 18:09

    hola buenas, tengo una pregunta. ¿Por que al llamar la funcion filtrar la primera vez entra en el if(nombre.indexOf(texto) !== -1) ?, si el valor de texto es nulo, y en el if pregunta si el texto va dentro del de nombre AYUDA!!!

  7. Andres Parra Garzón
    April 7, 2020 at 18:09

    Gran video

  8. Ezequiel Domínguez
    April 7, 2020 at 18:09

    Hermano, muchas gracias por el tutorial, explicas muy bien y se siente mas agradable que cualquier profesor de mi universidad JAJA, me suscribo

  9. ale cruz
    April 7, 2020 at 18:09

    Excelente video, me quedo a la primera. Tengo una duda si quiero que al momento que ya me salio la fruta le pueda pulsar y me lleve a otra parte con href como le puedo hacer, espero me puedas ayudar.

  10. Angel Infanti
    April 7, 2020 at 18:09

    Excelente vídeo amigo muy bien explicado, muchas gracias saludos desde Venezuela. Te ganaste un like y un sub

  11. Luis Serrano
    April 7, 2020 at 18:09

    Sería excelente un ejemplo con registros de una base de datos. Gracias por el video.

  12. Hernaldo Castro
    April 7, 2020 at 18:09

    buenas, consulta, se puede aplicar esto a un datatable,Jquery sin necesidad de usar el que trae x defecto.. gracias

  13. Juan López Diaz
    April 7, 2020 at 18:09

    que gran tutorial hombre, muy buen trabajo!, pregunta, que pasa si yo quiero que me muestre imágenes con texto, ¿como podría hacerlo?

  14. juan david vargas
    April 7, 2020 at 18:09

    Hola ignacio, de verdad muchas gracias por su video, tengo que comprar su curso de vue JS pero primero necesito aprender muy bien el JS. Le escribo por agradecerle por la explicación del tutorial.

    Ignacio, tengo una pregunta. Lo que pasa es que yo tengo un proyecto con su respectivo CRUD. Todo funciona de maravilla. Es mas ya estoy que acabo para entregarlo, pero tengo una duda. Necesito que funcione el buscador y pues sigo el tutorial y cuando escribo cualquier cosa, la consola me lo vale, pero no se como insertar la conexión a la base de datos para que me lea los registros que tengo usando JS. Muchas gracias, que pena por la molestia.

  15. ALFA+
    April 7, 2020 at 18:09

    uno pregunta se puede utilizar node js y morgan para hacer el buscador

  16. Gobierno Autónomo Municipal de Tomave
    April 7, 2020 at 18:09

    Exelente, pero como puedo realizarlo con datos que tengo en un array de una base de datos, espero su respuesta, gracias.

  17. Erwing Solorzano
    April 7, 2020 at 18:09

    brother y si quiero hacer con una base de datos…. se podría??

  18. limberth geovanny
    April 7, 2020 at 18:09

    Excelente tutorial me sirvio de mucho GRACIAS…!!!

  19. Yeisy Rodríguez
    April 7, 2020 at 18:09

    Muchas gracias. Bien explicado 😉
    Saludos desde Vzla..

  20. Nestor Rivas
    April 7, 2020 at 18:09

    Hola. Al hacer click en el botón, me muestra el producto buscado, pero al instante se actualiza la pagina. Que puede ser?

  21. Happy Code
    April 7, 2020 at 18:09

    Me he enamorado

  22. jose david duque gutierrez
    April 7, 2020 at 18:09

    una pregunta este metodo de busqueda lo puedo implementar con laravel?

  23. Gaston Alanis
    April 7, 2020 at 18:09

    Muchas gracias muy bien explicado 🙂

  24. Julio Villanueva
    April 7, 2020 at 18:09

    como puedo hacer que, al pulsar una opción se auto complete en la caja de texto

  25. Fabri Juncal
    April 7, 2020 at 18:09

    En vez de utilizar el boton para buscar:

    boton.addEventListener('click', filtrar);

    Se puede utilizar el evento del input, para que a medida que uno vaya escribiendo vaya filtrando:

    formulario.addEventListener('input', filtrar);

    Creo que esta manera es mas practica.
    Excelente video, saludos desde Argentina!!

  26. oduber e. vasquez b.
    April 7, 2020 at 18:09

    Excelente! Qué pasa si quiero buscar por varios campos, es decir, "nombre, descripción"??

  27. German Hernandez
    April 7, 2020 at 18:09

    Hola, los datos a buscar se podran traer de una base de datos?
    Chao

  28. Yunior Diaz
    April 7, 2020 at 18:09

    gracias por cada uno de tus videos!

  29. SAN JUAN DE AREO ESTADO MONAGAS VENEZUELA
    April 7, 2020 at 18:09

    Excelente muchas gracias por el apoyo

  30. angelo samir ttito
    April 7, 2020 at 18:09

    Solicitud de origen cruzado bloqueada: La misma política de origen no permite la lectura de recursos remotos en https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css. (Razón: Solicitud CORS sin éxito). no comprendo si lo puse igual,
    sale todo menos el css no hay estilos

  31. Carlos Peña
    April 7, 2020 at 18:09

    como puedo hacer esto en firebase

  32. Gabriel Romero
    April 7, 2020 at 18:09

    Más videos por favor maestro.

Leave A Comment

You must be logged in to post a comment.