CREAR UN DATATABLE CON JAVASCRIPT DESDE CERO
ฝัง
- เผยแพร่เมื่อ 20 ก.ย. 2024
- Video de diseño de tabla: • DISEÑO DE TABLA MODO O...
👍 Apóyame con un like para llegar a más developers 😊
✅ Te invito a suscribirte al canal 👉 bit.ly/TH-cam-...
🔔 Activa la campanita para notificarte del siguiente video
✅ Sígueme en las redes sociales:
Blog www.vidamrr.com
Facebook / vidamrr
Twitter / vidamrr
Instagram / vidamrr
❤ únete al canal para obtener beneficios exclusivos:
/ @vidamrr
😍 Más videos dentro del canal:
Café con Rivas - Vlogs bit.ly/mrr-vlogs
Curso de Node.js bit.ly/mrr-curs...
Curso de PHP + MySQL bit.ly/mrr-curs...
Basicos Dev bit.ly/basicos-dev
Tips y trucos bit.ly/tips-trucos
Mi primera app bit.ly/primera-app
Retos de programación bit.ly/problema...
Inspiración web bit.ly/mrr-insp...
Tutoriales Javascript bit.ly/tutorial...
Curso básico de CSS bit.ly/curso-cs...
Diseño elementos con CSS bit.ly/componen...
Mi primer sitio web con CSS bit.ly/primer-s...
Curso avanzado de CSS3 bit.ly/curso-css3
Sitio web Completo en CSS3 bit.ly/mrr-siti...
![เขามัทรี - เอ็กซ์ ศุภกฤต - จอนนี่มิวสิค [ Official MV ]](http://i.ytimg.com/vi/AS9ufKuQIVs/mqdefault.jpg)
Muchas gracias! pude utilizar toda esta explicación y lógica en mi primer proyecto, me salvaste
Aqui el unico pero que te voy a poner es que mezclas los datos con el html en la primer columna. =>
0: ""
1: "Marcos Rivas"
2: "CEO"
3: "San Francisco"
4: "28"
5: "2020/05/01"
Cuando deberia de ser =>
0: "available"
1: "Marcos Rivas"
2: "CEO"
3: "San Francisco"
4: "28"
5: "2020/05/01"
Por todo lo demas esta excelente!!!...gracias.
Muchísimas Gracias!!!, en verdad estaba esperando con ansias la segunda parte del vídeo, me es de gran ayuda para el proyecto en que estoy trabajando. Gracias!!! Saludos!!!
Donde esta la primera parte ya que no la encuentro por ningun lado
@@Kodemuri la primera parte se llama "DISEÑO DE TABLA EN MODO OSCURO EN CSS"
Una tala con estilo y funcionalidad excelente
Gracias hermano justo lo que necesitaba y con código puro
Excelente Marcos, Épica la tabla! 👏🏻👌🏻
Muchísimas Gracias Amigo!!!Saludos!!!
Excelente, hermanito, donde puedo verlo completo, es decir, desde cero.
Excelente projeto! Como ficaria a busca em uma api e preenchendo o datatable.
Muy buenos días, he estado viendo el vídeo veo que su nivel de javascript es muy alto y sus explicaciones sobre las líneas de código son muy cortas, no he visto en su canal ningun buen curso de javascript para aprender y poder comprender bien el vídeo, de todas maneras, muchas gracias, me hubiese gustado aprender javascript con vd. Tengo en udemy un curso de javascript avanzado pero usted en este vídeo lo supera con creces aunque no he aprendido nada de javascript con usted, excelente información, enhora buena. Si me recomienda algún curso de javascript partiendo de nivel básico a avanzado aunque se a de pago, me interesa que tenga buenas exiplicaciones y ejemplos, se lo agradería mucho, un saludo
hola porfavor podrias facilitar el codigo para el renderSelectEntries()? pausando el video he podido ver el codigo pero falta una parte que no alcanzo ver (despues del 'selected' : ...)... gracias un gran video
Hola, que tal?? queria preguntarte acerca de tu tipo de fuente, cual estabas usando en el video??
Excelente proyecto.
bro, gran video, pero te comiste la parte del método de renderSelectEntries(), viendo el video logre verlo, pero me falta la linea donde retornas un código html, después del 'selected' no alcanza a ver que sigue, me podrías ayudar con esa linea, te lo agradecería mucho.
falta igual una partecita, para los que no conocen mucho, no se puede completar
Consulta estimado : el codigo que pones en el html en la etiqueta script , serà posible agregarla en un archivo js y como seri esta mejora ?
Hola buenas tardes, una consulta: se puede ingresar un boton personalizado para cada línea de datos extraída desde la base de datos trabajando con datatable server side?
eres un crack bro... muchas gracias. :D
Amigo ya hana pasdo 2 años podrias integrarse server-side por favor muchos lo necesitamos
Excelente estimado.. Muy bien explicado... Una consulta... Este DataTable funcionará para grandes registros??? Por lo menos para más de 20,000???
Deberia aunque igual no se que tan recomendable sea meter en un elemento web tanta informacion Lenin
@@vidamrr Muchas gracias por la aclaración estimado.
Ótimo vídeo parabéns 👏.
También tengo un DataTable hecho con Java Script y html. Se supone que no necesita librería de DataTable Jquery. Lamentablemente me marca un error muy parecido a los DataTables que usan libreria. Uncaught TypeError: Cannot read properties of null (reading 'querySelector')
puedo crear esos datos y colocarlo en un datatables ya incorparado en un sistema?
esta muy bien, pero seria posible que hagas un video con el mismo programa con paradigma funcional? sin usar POO¿?
de casualidad no quieres también un par de cervezas?
Hola, 🖐️
Y como se podría recargar un listado o tabla de registros de mi página web, cada vez que se inserte un registro en mi base de datos...??? 🤔🤔
vuelves a llamar a la clase makeDataTable
hola buenas noches sera que puedas subir el proyecto por aqui?
Holaa... que tema estás usando y extensiones?? porfas me gustaron los colores... gran vídeo!!
Fira Code y Live Server
@@vidamrr y que pack folder de iconos estás usando??
Hola, que tema usas??
Hola como estas? podrias facilitar el codigo para el renderSelectEntries()? pausando el video he podido ver el codigo pero falta una parte que no alcanzo ver (despues del 'selected' : ...)
El 95% de los videos tutoriales en TH-cam en sus ejemplos para cargar un DATTABLES utilizan datos de JSON PLACEHOLDER. Algunos por ahí usan con MySQL.
Pregunto, porque no usar una base de registros de Excel o Access (estas herramientas se usan en todas las empresas)? Ojala algún experto lo considere, seria de mucha utilidad a usuarios que nos estamos insertando en la WEB.
hay algunas partes cortadas...
Buenas bro, en el apartado de renders, si yo por ejemplo en la funcion renderRows(){} traigo todos los td, pero por ejemplo uno de ellos lo manejo con un a de esta forma:
1
Mollito
Cristhian Salazar
Hace 1 día
Pendiente
VER PDF
RECHAZAR ACEPTAR
que más es como para darle tipo botónes en las últimas columnas, ¿Cómo podría yo obtener estos datos y pasarlos por cada registro que los tenga?
pudiste resolverlo?
necesito algo igual jajaja XD
Buen video
pero faltó la parte de renderSelectEntries()
Saludos
Ya lo adiviné
const html = [5,10,15].reduce((acc, item) => {
return (acc += `${item}`);
}, '');
Buen video, se podría hacer datatable editable sin modal?. Es muy parecida a las de vuetify con vue.
puedes hacer la funcionalidad si no la tiene o si quieres que actue de otra forma
@Vida MRR ¿cómo sería si la tabla se carga con datos que viene de una consulta por PHP?
Depende, si es renderizar directo con PHP tendrías que crear la estructura inicial con HTML para que JS la parsee y la transforme. Si quieres más cómo que PHP devuelva una API sería igual que JS haga la solicitud pero que PHP ya devuelva la estructura para que JS solo haga el parsing y cargue la info
@@vidamrr Gracias por la respuesta. Estaría bien que plantearas con eso una continuación a este video para efectuar la carga de datos dinámica por PHP directamente o mediante una petición a través de JS por AJAX. Saludos.
@@vidamrr podrias hacer un video sobre el proceso que estas explicando? solo me aparece el primer dato de la tabla de la base de datos en la datatable
Hay una dependencia para hacerlo en React?
No pero sí tendrías que cambiar la lógica para que sea reactiva y que manejes estado
Amigo no se alcanzo ver el tema de funcion renderSelectEntries() gracias!!!
x2
Pausa el video alrededor del minuto 01:04:15 para poder ver el método de renderSelectEntries() y, así, construir el select para elegir el número de registros por página.
@@pedro-j Gracias !!!
@@SanchayanPackiyanathan De nada ... Yo también me quedé con la duda y, al ver que no era el único que se había quedado sin esa explicación, revise el momento en el que antes de ese minuto va hacia abajo y ¡¡bingo!! :)
@@pedro-j vale vale!!!
que mentiroso eres. no colocaste el renderSelectEntries
en los comentarios esta escrito