Curso JavaScript: 96. DOM: Ejercicios Prácticos | Filtros de Búsqueda -

  Рет қаралды 42,448

jonmircha

jonmircha

Күн бұрын

Пікірлер: 224
@hugolopez2379
@hugolopez2379 Жыл бұрын
Me impacta lo poderoso y práctico que es CSS, sin duda se nota con tus clases que amas y tienes vocación para la programación, genio y figura hasta la sepultura, cordial saludos y tienes un suscriptor!! 🤓
@jonmircha
@jonmircha Жыл бұрын
😉👋🏻
@evalaya3832
@evalaya3832 4 ай бұрын
gracias demasiado bueno profesor ...bien explicado todo perfecto ...sabe tengo mucha mas seguridad ...de verdad no tengo con que pagarle tan buen curso y muy completo ... y si lo estoy haciendo desde el principio ...no soy de mucho escribir ...tengo dislexia ...gracias dios lo bendiga
@jonmircha
@jonmircha 4 ай бұрын
👋🏻😉
@instintoimagen
@instintoimagen 2 жыл бұрын
Cuando no anda display: none; Usar en CSS: .filter { /* display: none; */ visibility: hidden; opacity: 0; order: 1; } Para los ansiosos como yo, que se desquician cuando no anda y no terminaron de ver el video (la solución está en el minuto 25). El mejor #curso de #javascript
@jonmircha
@jonmircha 2 жыл бұрын
😆
@mrsh0rtz
@mrsh0rtz Жыл бұрын
muchas gracias amigo, me gusta mucho que en todos tus tutoriales enseñas de la forma perfecta, tal vez alguien venga a copiar y pegar pero al ver tu video incluso sin querer aprendes ajaja muchas gracias !!
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@giovannyvanegas88
@giovannyvanegas88 Жыл бұрын
Super interesante la solucion, vi este mismo ejercicio pero mas complejo, aqui se ve mas entendible. Gracias profesor Jon, se aprende mucho
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@carloscontreras6051
@carloscontreras6051 3 жыл бұрын
Muy buena forma de resolverlo, yo lo hice con expresiones regulares, fue lo primero que me vino a la mente, y pude hacerlo funcionar tambien Ya tengo varios archivos JS con tu codigo funcionando y mi codigo comentado, asi voy armando una base de datos interesante
@jonmircha
@jonmircha 3 жыл бұрын
😉👍🏻
@LuquePamela
@LuquePamela Жыл бұрын
Dias tratando de que me funcione el filter! gracias jon!! sos lo más!
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@martinbergesio1990
@martinbergesio1990 4 жыл бұрын
Genial súper bien explicado y muy útil. Lo único que he añadido es en el método .includes() al e.targe.value el método toLoweCase() así si el usuario introduce mayúsculas en su búsqueda el filtro funciona igualmente. .includes(e.target.value.toLowerCase()) github.com/Dachi90/Curso-Jon-MirCha/tree/master/Video%2080%20al%20104 Un saludo, muchas gracias :D
@jonmircha
@jonmircha 4 жыл бұрын
Excelente!
@angelicagarzon9726
@angelicagarzon9726 7 ай бұрын
gracias por el aporte no lo habia visto
@ivorguzman1736
@ivorguzman1736 4 жыл бұрын
Exelente pedagogía y conocimientos solidos, Gracias
@jonmircha
@jonmircha 4 жыл бұрын
De nada, comparte para llegar a más gente :)
@yovanyescobarrojas2041
@yovanyescobarrojas2041 3 жыл бұрын
profe gran video muchas gracias por compartir tus conocimientos, trate de hacer lo pero no pude , al final me rendy , pero bueno cada vez que caigo me levanto . saludos desde colombia
@jonmircha
@jonmircha 3 жыл бұрын
ánimo!!!!
@axelfuentesmartinez4401
@axelfuentesmartinez4401 3 жыл бұрын
Me encantó con la opacidad y transparencia este. Gracias Jon! Saludos a KeNai.
@jonmircha
@jonmircha 3 жыл бұрын
@ronalddavidhernandezpadill8182
@ronalddavidhernandezpadill8182 6 ай бұрын
I already did the excercise, now I'm going to watch your solution.
@jonmircha
@jonmircha 6 ай бұрын
👋🏻😉
@CarlosDan
@CarlosDan 3 жыл бұрын
Buenos trucos, el curso inmejorable, de los mejores de youtube!
@jonmircha
@jonmircha 3 жыл бұрын
Muchísimas gracias!
@heimancastro1954
@heimancastro1954 4 ай бұрын
gracias maestro otra buena clase
@jonmircha
@jonmircha 4 ай бұрын
Con mucho gusto👋🏻😉
@emersonpalaciootalvaro2632
@emersonpalaciootalvaro2632 4 жыл бұрын
Realmente por mucho, lo mejor de js en la web
@terkobits
@terkobits 2 жыл бұрын
Yo lo hice con la función String.search(), me funciona perfecto también
@jonmircha
@jonmircha 2 жыл бұрын
😉👍🏻
@sergiocenteno0809
@sergiocenteno0809 2 жыл бұрын
Aunque tuve que adecuar muchas cosas de acuerdo a mi proyecto, ya que soy super principiante, tu vídeo me ayudó mucho para poder hacer mi filtrado. Muchas gracias.
@jonmircha
@jonmircha 2 жыл бұрын
🤓👍🏻
@victormontivero1998
@victormontivero1998 3 жыл бұрын
Excelente ejercicio, este si que no me había salido, trate de no copiar el código y extraer la idea y ahora voy a probar hacerlo.
@jonmircha
@jonmircha 3 жыл бұрын
Mucha suerte!
@leonardoprone5967
@leonardoprone5967 2 жыл бұрын
Impresionante clase, Jon!! muchas gracias
@jonmircha
@jonmircha 2 жыл бұрын
Mil gracias!
@shepharddeveloper5823
@shepharddeveloper5823 2 жыл бұрын
Por este vídeo conocí tu canal xD la primera vez que lo vi no tenia idea que era un ejercicio de una serie de Ejercicios del DOM xD No creí llegar hasta acá, pero ahora que lo hice estoy muy seguro que lo termino completando :3
@jonmircha
@jonmircha 2 жыл бұрын
👋🏻😉
@aalfaros
@aalfaros 3 жыл бұрын
hola profe ! para quitar el filtro cuando le damos a la "X" que limpia la caja de búsqueda, podemos oír el evento "input" en lugar del evento "keyup", así vuelve a mostrar todas las tarjetas también apliqué "toLowerCase" al contenido de la caja de búsqueda para que sea indiferente si el usuario busca con mayúsculas muchas gracias por sus clases !
@jonmircha
@jonmircha 3 жыл бұрын
;)
@z3r0krypt
@z3r0krypt 3 жыл бұрын
Muy buena esa sugerencia Andrés! Me ha venido genial, no se me ocurrió cuando lo estaba haciendo :)
@carloscontreras6051
@carloscontreras6051 3 жыл бұрын
Estaba por buscar como solucionar eso cuando lei esto, muchas gracias!
@instintoimagen
@instintoimagen 2 жыл бұрын
Muy bueno, re util tu comentario, gracias
@Juicio87
@Juicio87 2 жыл бұрын
Un héroe sin capa
@alejandracasado7636
@alejandracasado7636 3 жыл бұрын
Este video es de mis preferidos!! Gracias Profe!!
@jonmircha
@jonmircha 3 жыл бұрын
😉👌
@manoloexplaintome6348
@manoloexplaintome6348 3 жыл бұрын
Gracias por compartir tus conocimientos. Eres el Messi de JS.
@jonmircha
@jonmircha 3 жыл бұрын
Nooooo, el Cristiano!!!!! 🤭 No es que me caiga mal Messi, pero él es un virtuoso, en cambio Cristiano ha obtenido todo sus éxitos a base de puro y duro esfuerzo, y en ese sentido no me considero un virtuoso del código, lo que sé lo se a base de mucho esfuerzo y varias horas de práctica
@LeonardoProne
@LeonardoProne Жыл бұрын
Gran clase, Jon! muchas gracias!
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@brandonluna8245
@brandonluna8245 Жыл бұрын
Uff jon estuvo cañon el ejercicio jaja no pude darme cuenta que con includes era la forma correcta y no con un "==="
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@addevmoises
@addevmoises 3 жыл бұрын
Siempre quise saber como se filtraban las búsquedas cuando uno busca en un sitio de ventas ahora supe una forma :)
@jonmircha
@jonmircha 3 жыл бұрын
;)
@kikemadrigalr
@kikemadrigalr 4 жыл бұрын
Saludos Jon, Saludos compañeros. Que fácil resolviste este ejercicio. No sabes las vuelta que le di para realizar mi solución y hasta estaba aplicando cosas que al final vi innecesarias. Estuve probando formar una expresión regular con lo que capturaba en el input. ademas que recorría todo manualmente, no había utilizado en queryselectorAll. Ademas para llegar al texto buscaba el ultimo hijo de figure y su textContent. Cosas que para nada aplicaste acá.. Se reduce muchísimo el código.. Así que una vez mas fue genial verte resolverlo.
@jonmircha
@jonmircha 4 жыл бұрын
;)
@sebastiandossantos7158
@sebastiandossantos7158 Жыл бұрын
Cargué desde un array las diferentes imagenes con sus respectivos nombres y me volví loco! No pude lograr hacer el ejercicio. No quería usar este truco de agregar o sacar la clase que tiene display none ya que si tuviera que desarrollar una app de venta de diferentes productos y esta tuviera muchos; no sería funcional cargarlos directamente desde el HTML.. y vengo rendido y Jon lo hace así 🥴. Jaja igual entiendo que es un ejercicio para seguir aprendiendo y terminar de entender los conceptos. Quien quiso adelantarse fui yo. Gracias como siempre amigo y docente digital!!! 🙃🙃🙃
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@jerlandejoseph4350
@jerlandejoseph4350 2 жыл бұрын
Que bueno, ya había visto toda la serie de grid y flexbox valla que es muy necesaria
@jonmircha
@jonmircha 2 жыл бұрын
👍🏻😉
@mauriciochavarro4976
@mauriciochavarro4976 3 ай бұрын
Mil gracias por el contenido es de muy buena calidad, mira que darle click en la x cuando hay texto, y no me aparece los cards
@tongastonga22
@tongastonga22 9 ай бұрын
Gracias Jooon!!
@jonmircha
@jonmircha 9 ай бұрын
Con gusto👋🏻😉
@greiberantonioalburjasalva5299
@greiberantonioalburjasalva5299 2 жыл бұрын
excelentes sus videos
@jonmircha
@jonmircha 2 жыл бұрын
Gracias. Saludos
@williamalexanderpineda6098
@williamalexanderpineda6098 3 жыл бұрын
Gracias por todo!
@jonmircha
@jonmircha 3 жыл бұрын
A la orden
@juanmanuelocampo4400
@juanmanuelocampo4400 2 жыл бұрын
quiero aprender js, que mejor que este curso que me ha ayudado tanto
@jonmircha
@jonmircha 2 жыл бұрын
Excelente!👋🏻😉
@naqzher
@naqzher 4 жыл бұрын
muy bueno como siempre, me estaria faltando aprender sobre css grid. gracias !
@luian685
@luian685 3 жыл бұрын
css grid en "facil" de aprender, puedes consultar en csstricks, tiene un manual muy bueno
@Wiiiiizard
@Wiiiiizard 2 жыл бұрын
🧙‍♂Muchas gracias, buenisimo el curso!!!
@timawid
@timawid Жыл бұрын
Excelente explicación ✅
@jonmircha
@jonmircha Жыл бұрын
Gracias. Saludos👋🏻😉
@oreodevainilla
@oreodevainilla 2 жыл бұрын
Gracias crack. Simple y sencilla la explicacion, como debe ser :D
@jonmircha
@jonmircha 2 жыл бұрын
Con gusto
@EducacionCultura1992
@EducacionCultura1992 Жыл бұрын
Excelente 🫡
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@Juicio87
@Juicio87 2 жыл бұрын
Lo hice similar pero usando map (pasé el NodeList a un array) y el método startsWith(); lo que no sabía es que se podía acceder al textContent directamente desde figure, yo lo que hice fue acceder a este pero pasando por el childNode de figure. El método startsWith() se asegura que solo aparezcan las tarjetas que empiecen por la letra que pones en el input
@jonmircha
@jonmircha 2 жыл бұрын
😉👍🏻
@sergiocr4266
@sergiocr4266 3 жыл бұрын
Excelente a darle js puro
@jonmircha
@jonmircha 3 жыл бұрын
Vamos!
@EnzoScodellaro
@EnzoScodellaro Жыл бұрын
Genio!
@jonmircha
@jonmircha Жыл бұрын
😉👋🏻
@fadelsalem4172
@fadelsalem4172 2 жыл бұрын
Genial como siempre Jon. Para quitar el filtro pulsando al button (x) del input search, como ves si hacerlo con eso: d.querySelector(input).addEventListener("search", (e)=>{ d.querySelectorAll(selector) .forEach(el => el.textContent.toLowerCase().includes(e.target.value) ? el.classList.remove("filter") : el.classList.add("filter") ); }) O hay otra manera mas facil? Un saludo
@jonmircha
@jonmircha 2 жыл бұрын
👍🏻
@carlos9574
@carlos9574 4 жыл бұрын
Buen ejemplo
@leomax522
@leomax522 Жыл бұрын
Hola, perdón por la corrección, me da verguenza agregar algo sobre lo que muestra Jon, pero por si alguien está probando el código de este ejercicio, si en el input ingresan datos en mayúsculas no va a funcionar porque falta agregar el .toLowerCase() al 'e.target.value'. La línea completa sería esta : (el.textContent.toLowerCase().includes(e.target.value.toLowerCase())) Gracias por todo Jon. Saludos.
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@floyd844
@floyd844 Жыл бұрын
Hola, me alegra ver una respuesta como ésta. Justo hoy llegué a esta parte y noté lo mismo. Aporta mucho valor y seguro que al profe Jon le alegra también porque estaría logrando su cometido de enseñar a la comunidad y estos detalles son fruto del aprendizaje que llevas 👍
@jurrrgenOF
@jurrrgenOF 3 жыл бұрын
ahora si me dieron ganas de aprender grid
@jonmircha
@jonmircha 3 жыл бұрын
😉👍🏻
@alannm5414
@alannm5414 3 жыл бұрын
Que buen ejercicio fue este, por suerte lo pude resolver
@jonmircha
@jonmircha 3 жыл бұрын
Excelente!
@reactivoJS
@reactivoJS Жыл бұрын
Que bueno lo del grid y el visibility y order de css, cuando hice mi FP mi profesor de front era malisimo y no nos enseñó nada nada.
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@seica5561
@seica5561 4 жыл бұрын
Excelente Curso Jon.. He aprendido mucho de tus conocimiento en javascript.. Jon. que sabes de la API de EXCEL para JavaScript?.. Gracias
@jonmircha
@jonmircha 4 жыл бұрын
No la conozco :P
@r.w.s.2402
@r.w.s.2402 3 жыл бұрын
Eres un gran profesor!
@jonmircha
@jonmircha 3 жыл бұрын
🙈🤗
@josemurillo1977
@josemurillo1977 4 жыл бұрын
Gran Master Class, como siempre
@jonmircha
@jonmircha 4 жыл бұрын
gracias :)
@sandokanArg
@sandokanArg 4 жыл бұрын
muy bueno Jon el Filtro, espero poder usarlo sin tu ayuda en un proyecto que empezare la semana que viene usando mySql. Espero el lunes a estar con tiempo para ver en vivo el video nuevo (en Argentina pasamos a Fase 1 otra vez parece :( con la pandemia en Capital y Buenos Aires ), ya esto al dia con los videos anteriores, pero para ser onesto, aun no me largue solo a tirar codigos, pero ya casi puedo escribir al momento que estas hablando. me mareo cuando empezas a sacar corchetes para hacer mas lindo el codigo, pero ya lo voy agarrando. Asi empece con Php (nivel medio...cre), asi que espero que me resulte con JS.
@jonmircha
@jonmircha 4 жыл бұрын
Excelente Raul, verás que con la práctica cada día te será más fácil.
@sandokanArg
@sandokanArg 4 жыл бұрын
​@@jonmircha Necesito tu forma de pensar, ahora empecé el de responsive desing CSS, creo que empecé mal a ver videos, primero PHP y Mysql, después JS y ahora RD CSS. tendría que Haber hecho html5, RD, PHP y Mysql y JS, lo que sigue, pero esperemos que se alineen los planetas y mi cerebro los organice en la forma correcta
@jonmircha
@jonmircha 4 жыл бұрын
@@sandokanArg no hay un camino correcto o incorrecto, simplemente son diferentes tecnologías unas son Backend otras son Frontend complementarlas es lo importante ;)
@sandokanArg
@sandokanArg 4 жыл бұрын
jonmircha ok, todos los caminos llevan a Roma entonces. Asi q le sigo dandole a los videos como perro y q se llene mi disco rigido de conocimientos, desp a implementarlos y ser un jon mircha en porencia.
@spiderdev5166
@spiderdev5166 2 жыл бұрын
@@sandokanArg como vas wey?
@jurrrgenOF
@jurrrgenOF 2 жыл бұрын
eres el mejor jon
@jonmircha
@jonmircha 2 жыл бұрын
🙈🙌🏻
@Henry_Nunez
@Henry_Nunez 3 жыл бұрын
Muchas gracias, estoy empezando y me gusta la manera de explicar, entendí todo pero no he bajado el código todavía pero si no esta actualizado indíqueme donde y como actualizarla por favor. 👍
@jonmircha
@jonmircha 3 жыл бұрын
El repo es este github.com/jonmircha/youtube-js
@CarlosVasquez-qy5fs
@CarlosVasquez-qy5fs Жыл бұрын
tendrás algún vídeo de como hacer una opción de búsqueda para una base de datos en json que se muestra en HTML con JavaScript?
@davidruiz3616
@davidruiz3616 4 жыл бұрын
Gracias por su ayuda esta muy bueno el contenido y la información
@jonmircha
@jonmircha 4 жыл бұрын
De nada, comparte para llegar a más gente :)
@joelpimentel3125
@joelpimentel3125 3 жыл бұрын
Lo hice diferente coloque los nombres de las imagenes en un array luego utilicé filter retornando el valor que contenga las letras escritas en el input y fui creando las tarjeta con un innerHtml
@jonmircha
@jonmircha 3 жыл бұрын
;)
@FrankDevs
@FrankDevs 3 жыл бұрын
Mas de una hora estuve buscando un error que me aprarecia en la consola que me decia que "el" del forEach no estaba definido y el error era que estaba poniendo el operador ternario fuera de la funcion forEach. Lo bueno es que voy agarrando experiencia, los erroresque antes me hacian perder micho tiempo ya los puedo reconocer muy rápido.
@jonmircha
@jonmircha 3 жыл бұрын
😉👍🏻
@hernangarcia77
@hernangarcia77 3 жыл бұрын
Hola jon. Muy buena clase, como nos tienes acostumbrados. Lo unico malo que veo con visibility hidden es que si hay suficientes tarjetas como para que se produzca scroll cuando se reduzca la cantidad a unas pocas por el filtro la ventana seguira haciendo scroll cierto?
@jonmircha
@jonmircha 3 жыл бұрын
:O no sé deja reviso ?_?
@braianrico4422
@braianrico4422 3 жыл бұрын
Genial como siempre, bendiciones Jon!!!
@jonmircha
@jonmircha 3 жыл бұрын
Igualmente!
@davidavellaneda133
@davidavellaneda133 3 жыл бұрын
Oigan en los ejercicios de Ajax si realizan ese ejercicio que dijo el profe?
@lorenainfanter.3099
@lorenainfanter.3099 3 жыл бұрын
Me encantó! Muy práctico y bien explicado. Muchas gracias! Pregunta, este filtro debería funcionar sin ningún problema también en vista de celular (responsive), verdad?
@jonmircha
@jonmircha 3 жыл бұрын
@lorenainfanter.3099
@lorenainfanter.3099 3 жыл бұрын
@@jonmircha Gracias!
@carlosdanielculmaperdomo5048
@carlosdanielculmaperdomo5048 3 жыл бұрын
Esta bueno, oye te puedo sugerir que si puedes hacer un video sobre buscador de imagenes con pixabay que le permita ver la foto o la imagen con el boton es decir si aprietas el boton le abre la imagen será que puedes por favor
@jonmircha
@jonmircha 3 жыл бұрын
Tengo ejercicios similares con otras APIs en los ejercicios de AJAX y APIs REST
@josedaniel3316
@josedaniel3316 2 жыл бұрын
un crack tio jhon
@jonmircha
@jonmircha 2 жыл бұрын
👋🏻😃
@teconologia238
@teconologia238 3 жыл бұрын
muchas gracias por este contenido, lo que quisiera aplicar es que si no encuentra el contenido le salga un texto de que no lo encontro
@jonmircha
@jonmircha 3 жыл бұрын
Seguro que lo programas 😉✌🏻
@asumumifumurubenndong2464
@asumumifumurubenndong2464 3 жыл бұрын
eres grande jon
@carlesbautista8293
@carlesbautista8293 3 жыл бұрын
Gracias Jonathan, muy interesante :)
@jonmircha
@jonmircha 3 жыл бұрын
Gracias a ti!
@agustinserrano7122
@agustinserrano7122 2 жыл бұрын
Hola profe una pregunta: La clase card es una figure y tiene 2 hijos que son una img y un figcaption. Mi duda es en el minuto 22:55, linea de codigo n9. El texContent hace referencia a la figure pero la figure no tiene texto. La que tiene contenido es la figcaption. TexContent aplica sobre los hijos? Gracias
@jonmircha
@jonmircha 2 жыл бұрын
@perezheguy
@perezheguy 4 жыл бұрын
Hola Jon pregunta lanzara el curso de GRIS css? Muchas Gracias
@jonmircha
@jonmircha 4 жыл бұрын
Muy pronto
@darx9050
@darx9050 2 жыл бұрын
Muchas gracias por tan generosa informacion Jhon, disculpa la molestia tengo una duda, ¿Porque en este caso no fueron necesarias variables con el signo $, en cuanto consiga mi primer empleo te invitare no una si no una docena de tacos a tu cuenta. $
@jonmircha
@jonmircha 2 жыл бұрын
Quiza por que no cree elementos del DOM
@darx9050
@darx9050 2 жыл бұрын
@@jonmircha muchas gracias, eres la bendicion que los junior necesitabamos.
@kevinayon5367
@kevinayon5367 Жыл бұрын
Hola Maestro una duda Se pueden dicriminar los registros Usando una Tabla HTML en vez de grid?? Filtrar por ejemplo con algun id y si tengo 10 registros solo me muestre el que teclee en la caja de texto y los otros los oculte es posible??
@jonmircha
@jonmircha Жыл бұрын
No por que una tabla no tiene la propiedad order
@kevinayon5367
@kevinayon5367 Жыл бұрын
@@jonmircha Ok maestro si intente mucho pero no pude muchas gracias 🙏🏻
@mercurioazul630
@mercurioazul630 4 жыл бұрын
Oye jon, ¿hay una diferencia de rendimiento si no uso llaves que cuando las uso cuando solo hay una linea de codigo? o solo son cosas esteticas.
@jonmircha
@jonmircha 4 жыл бұрын
No, mera estética
@kenedicahuana5110
@kenedicahuana5110 4 жыл бұрын
Esto quiero entender bien, para hacer mis propios filtros de contact list
@jonmircha
@jonmircha 4 жыл бұрын
No te pierdas el estreno mañana 🤓
@kenedicahuana5110
@kenedicahuana5110 4 жыл бұрын
@@jonmircha profe, pero va ser en vivo?, para hacer preguntas*
@jonmircha
@jonmircha 4 жыл бұрын
Los estrenos son videos programados y grabados, la ventaja es que cuando se estrena YOuTube nos da un chat en vivo y siempre estoy en los estrenos resolviendo preguntas vía chat
@helipalacio8772
@helipalacio8772 Жыл бұрын
👏🏻👏🏻👏🏻 🙏🏻🙏🏻🙏🏻
@jonmircha
@jonmircha Жыл бұрын
😉
@irenediaz9751
@irenediaz9751 Жыл бұрын
Me encantaría saber una pagina como placeIMG porque va a desaparecer en junio de este año y me parece muy útil
@LeonardoProne
@LeonardoProne Жыл бұрын
Hola Jon, excelente clase! En desktop funciona a la perfección, pero no funciona en mobile. Sabés cómo se soluciona?
@LeonardoProne
@LeonardoProne Жыл бұрын
encontré una solución, en Android me funciona, no sé si es la única solución. El código que habría que agregar es idéntico al del evento "keyup", reemplazando solo "keyup" por "touchstart". Aquí lo paso, gracias por todo, Jon: d.addEventListener("touchstart", (e)=>{ if (e.target.matches(".card-filter")) { if (e.key==="Escape") e.target.value=""; d.querySelectorAll(".card").forEach((el)=> el.textContent.toLowerCase().includes(e.target.value.toLowerCase()) ? el.classList.remove("filter") :el.classList.add("filter") ) } })
@jonmircha
@jonmircha Жыл бұрын
👍🏻
@helipalacio8772
@helipalacio8772 Жыл бұрын
👏👏👏 🙏🙏🙏
@jonmircha
@jonmircha Жыл бұрын
👋🏻😉
@AngelSalazar-uf5fk
@AngelSalazar-uf5fk 3 жыл бұрын
Yo utilicé match en vez de include, y funcionó
@jonmircha
@jonmircha 3 жыл бұрын
;)
@AngelSalazar-uf5fk
@AngelSalazar-uf5fk 3 жыл бұрын
@@jonmircha Pero es una mala práctica ? o es irrelevante usar cualquierda ?
@jonmircha
@jonmircha 3 жыл бұрын
@@AngelSalazar-uf5fk Ambas son buenas prácticas usa la que te sirva
@z3r0krypt
@z3r0krypt 3 жыл бұрын
No sé si alguno lo probó a día de hoy pero el añadido del condicional del "Escape", a mí personalmente Chrome ya me lo hizo automáticamente, no probé con otros navegadores, pero por mera curiosidad, se sabe si actualmente es necesario aún? Es pura curiosidad, pero es que probé y al dar "escape" sin el condicional ya me borró todo, reseteando el input y volviendo a mostrar las cards.
@jonmircha
@jonmircha 3 жыл бұрын
😮
@pepepixal6640
@pepepixal6640 3 жыл бұрын
hola, en edge y chrome funciona por defecto, pero en mozilla no y tampoco sale el "tachecito" x - saludos
@davidm.8835
@davidm.8835 4 жыл бұрын
Sólo es una sugerencia, pero podría estar muy bien a final de este curso actualizar la aplicación que hiciste de súper héroes con las nuevas funciones JS. :D
@jonmircha
@jonmircha 4 жыл бұрын
Haré algo similar tipo CRUD :)
@brayanorellanos9367
@brayanorellanos9367 3 жыл бұрын
con esta linea en el css, no crecen los grid items. grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px),1fr));
@jonmircha
@jonmircha 3 жыл бұрын
👍🏻
@jonnathanbaculima4447
@jonnathanbaculima4447 2 жыл бұрын
Buenas noches..!!! Tal vez alguien me ayude u oriente cómo puedo filtrar, el último récord o ID registrado y solo me muestre ese id en una tabla 🙏🙏🙏... Profe jonh eres un genio!!!
@jonmircha
@jonmircha 2 жыл бұрын
🤓👍🏻
@dfg259
@dfg259 2 жыл бұрын
Hola, tenes idea de porque puede ser que en pc funcione correctamente, pero en celular al realizar la busqueda se borran todos los elementos?
@jonmircha
@jonmircha 2 жыл бұрын
🤔
@Cristian-kk9ke
@Cristian-kk9ke 10 ай бұрын
disculpe, se puede crear un filtro de búsqueda para utilizar en Instagram?
@jonmircha
@jonmircha 10 ай бұрын
tendrías que interactuar con el API de IG
@estebanoctaviopavezllanca2385
@estebanoctaviopavezllanca2385 4 жыл бұрын
Estimado adjunto ejercicio github.com/Stev-189/Ejercicio_DOM Gracias Profe.-
@tucprogram
@tucprogram Жыл бұрын
Chicos podrian ayudarme tengo el codigo igual al profesor. Pero me da error en el Foreach(el) donde removemos o agrefamos la clase filter me sale en consola el is not defined at htmlDocument.
@trovu9157
@trovu9157 Жыл бұрын
😮😮
@Error-ow5rh
@Error-ow5rh 3 жыл бұрын
cuando doy click en un input en mi codigo automático se aplica el disabled y queda inhabilitado, como puedo hacer para que al dar click no se ponga el disabled
@F4R1TH
@F4R1TH 3 жыл бұрын
Existe alguna solución para dispositivos móviles? al momento de escribir no selecciona nada :(
@jonmircha
@jonmircha 3 жыл бұрын
😮
@LeonardoProne
@LeonardoProne Жыл бұрын
el evento en móviles se llama "touchstart", es solo cambiar keyup por touchstart d.addEventListener("touchstart", (e)=>{ if (e.target.matches(".card-filter")) { if (e.key==="Escape") e.target.value=""; d.querySelectorAll(".card").forEach((el)=> el.textContent.toLowerCase().includes(e.target.value.toLowerCase()) ? el.classList.remove("filter") :el.classList.add("filter") ) } })
@victormaldonado6269
@victormaldonado6269 4 жыл бұрын
Por un momento llegué a pensar en expresiones regulares. Ya ni me imagino la cantidad de código innecesario que voy a usar en mi primera aplicación :(
@jonmircha
@jonmircha 4 жыл бұрын
Ánimo :)
@victormaldonado6269
@victormaldonado6269 4 жыл бұрын
@@jonmircha Muchas gracias profe!!! MI tarea es hacerla funcional solo con HTML5 y Javascript (Node js y postgresql), luego repasarla y mejorar código, pero aprender frameworks que no me incluyan casi librerías, pero me ayuden a optimizar el código JS ¿Cual considera que sería el Kit recomendado?
@jonmircha
@jonmircha 4 жыл бұрын
@@victormaldonado6269 Si no quieres usar librerías programa artesanalmente con el lenguaje :)
@jeisongarzon6066
@jeisongarzon6066 3 жыл бұрын
Si quisiera mostrar un mensaje tipo "No hay ningun elemento que coincida con tu búsqueda", definitivamente una vez no halla ningun resultado, me podrias dar alguna idea de como podria hacerlo con este ejercicio ? gracias
@jonmircha
@jonmircha 3 жыл бұрын
busca los elementos a los que no se le aplica la clase que oculta
@jeisongarzon6066
@jeisongarzon6066 3 жыл бұрын
@@jonmircha gracias profe por responder, apesar de que me demore casi 3 horas lo hice al fin validando con classList.contains y ocultando y mostrando con display none y inital una etiqueta p que tiene el mensaje.
@sergiocastillo3992
@sergiocastillo3992 2 жыл бұрын
@@jeisongarzon6066 hola amigo, podrías compartir el código por favor; también necesito que muestre un mensaje tipo: "No se han encontrado información." De antemano gracias.
@helipalacio8772
@helipalacio8772 Ай бұрын
👨
@jonmircha
@jonmircha Ай бұрын
👋🏻😉
@diegoahumada7554
@diegoahumada7554 2 жыл бұрын
Al hacer la invocación de la función, la pantalla se queda en blanco no sé porque, a que puede deberse??
@jonmircha
@jonmircha 2 жыл бұрын
🤔
@diegoahumada7554
@diegoahumada7554 Жыл бұрын
@@jonmircha Solucioné el problema cambiando las modificaciones de visibilidad de los elementos, por modificación directa sobre el objeto precargado con los elementos de la lista, el cual al igual que tu haces en el carrito de compras cargas inicialmente desde un archivo en el reducer, solo me queda ajustarlo para que esa lista no la cargue de un fichero, sino con la respuesta de un microservicio...
@sneydergarcia1953
@sneydergarcia1953 3 жыл бұрын
me siento mal por ver esto gratis
@jonmircha
@jonmircha 3 жыл бұрын
Puedes invitarme un taco 🌮😋 www.paypal.com/paypalme/jonmircha
@angelabrahamlopezdelgado7574
@angelabrahamlopezdelgado7574 2 жыл бұрын
Por que no mejor usas change, por si alguien solo copia y pega esos datos y se dispare el evento
@jonmircha
@jonmircha 2 жыл бұрын
En que parte ?
@valentinherreraroldan812
@valentinherreraroldan812 2 жыл бұрын
buenas, en mi caso cuando presiono el escape ya de forma automática me borra el contenido del input, a lo que me vuelve a mostrar todas las tarjetas otra vez, no me sucede esto cuando presiono en la "x" del input, alguien sabe a que se debe?
@jonmircha
@jonmircha 2 жыл бұрын
Esa X tiene otro evento
@LeonardoProne
@LeonardoProne Жыл бұрын
Hola Jon, cual sería ese evento, porque lo estoy investigando y no encuentro cómo lograr que el value= " " cuando se presiona la "X". Gracias desde ya
@josefabianbeltranmeza6914
@josefabianbeltranmeza6914 3 жыл бұрын
Jajajaja yo y mis 100 líneas de código; Solución del Master: 18 líneas.
@jonmircha
@jonmircha 3 жыл бұрын
🤭🤭🙈
@hardisonpaulino8846
@hardisonpaulino8846 Жыл бұрын
🦾🤓
@jonmircha
@jonmircha Жыл бұрын
😉👋🏻
@avrilgiacosa
@avrilgiacosa 2 жыл бұрын
La consola me tira un error "Unexpected keyword 'export' ", voy a colapsar jajajajaja
@jonmircha
@jonmircha 2 жыл бұрын
Y ejecutaste tu servidor web ????
@weslinmartinez1802
@weslinmartinez1802 4 жыл бұрын
que Dios tenga misericordia del que le dio dislike a este video
@carlosjuliomesag.5528
@carlosjuliomesag.5528 2 жыл бұрын
Por ese acto del infierno no se salva
Friends make memories together part 2  | Trà Đặng #short #bestfriend #bff #tiktok
00:18
Mia Boyka х Карен Акопян | ЧТО БЫЛО ДАЛЬШЕ?
1:21:14
Что было дальше?
Рет қаралды 11 МЛН
Wait… Maxim, did you just eat 8 BURGERS?!🍔😳| Free Fire Official
00:13
Garena Free Fire Global
Рет қаралды 9 МЛН
Creando un filtro de busqueda simple con JavaScript
18:51
on the code
Рет қаралды 2,5 М.
BUSCADOR en TIEMPO REAL con JAVASCRIPT utilizando FILTER!! 😱
34:25