CREAR UN DATATABLE CON JAVASCRIPT DESDE CERO

Поделиться
HTML-код
  • Опубликовано: 9 ноя 2024

Комментарии • 68

  • @santiagocaceres806
    @santiagocaceres806 Год назад +1

    Muchas gracias! pude utilizar toda esta explicación y lógica en mi primer proyecto, me salvaste

  • @ivorguzman1736
    @ivorguzman1736 3 года назад +1

    Una tala con estilo y funcionalidad excelente

  • @cpaez2000
    @cpaez2000 3 года назад +1

    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.

  • @ezequielmendoza9196
    @ezequielmendoza9196 4 года назад +3

    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!!!

    • @Kodemuri
      @Kodemuri 2 года назад

      Donde esta la primera parte ya que no la encuentro por ningun lado

    • @ezequielmendoza9196
      @ezequielmendoza9196 2 года назад +3

      @@Kodemuri la primera parte se llama "DISEÑO DE TABLA EN MODO OSCURO EN CSS"

  • @Deleted-uu4km
    @Deleted-uu4km 4 года назад

    Excelente Marcos, Épica la tabla! 👏🏻👌🏻

  • @daioncode862
    @daioncode862 4 года назад +1

    Gracias hermano justo lo que necesitaba y con código puro

  • @maximo_vj
    @maximo_vj 6 месяцев назад

    Excelente, hermanito, donde puedo verlo completo, es decir, desde cero.

  • @SanchayanPackiyanathan
    @SanchayanPackiyanathan 4 года назад +1

    Muchísimas Gracias Amigo!!!Saludos!!!

  • @alejandrocondori1788
    @alejandrocondori1788 3 года назад

    Hola, que tal?? queria preguntarte acerca de tu tipo de fuente, cual estabas usando en el video??

  • @adelinopds
    @adelinopds 4 года назад +1

    Excelente projeto! Como ficaria a busca em uma api e preenchendo o datatable.

  • @gustavoandresmaedoconejera6023
    @gustavoandresmaedoconejera6023 Год назад +1

    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 ?

  • @jesumaran
    @jesumaran 2 года назад

    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

  • @playsi5955
    @playsi5955 3 года назад

    Excelente proyecto.

  • @magingonzalo5062
    @magingonzalo5062 Год назад +3

    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

  • @jcardenas9664
    @jcardenas9664 4 года назад

    Holaa... que tema estás usando y extensiones?? porfas me gustaron los colores... gran vídeo!!

    • @vidamrr
      @vidamrr  4 года назад

      Fira Code y Live Server

    • @jcardenas9664
      @jcardenas9664 4 года назад

      @@vidamrr y que pack folder de iconos estás usando??

  • @alexmontalvoreyes3075
    @alexmontalvoreyes3075 2 года назад

    eres un crack bro... muchas gracias. :D

  • @leninvladimirriosvasquez3406
    @leninvladimirriosvasquez3406 4 года назад +1

    Excelente estimado.. Muy bien explicado... Una consulta... Este DataTable funcionará para grandes registros??? Por lo menos para más de 20,000???

    • @vidamrr
      @vidamrr  4 года назад

      Deberia aunque igual no se que tan recomendable sea meter en un elemento web tanta informacion Lenin

    • @leninvladimirriosvasquez3406
      @leninvladimirriosvasquez3406 4 года назад

      @@vidamrr Muchas gracias por la aclaración estimado.

  • @ricardocuevas1578
    @ricardocuevas1578 3 года назад +3

    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.

    • @Juan-uj5fs
      @Juan-uj5fs 2 года назад

      falta igual una partecita, para los que no conocen mucho, no se puede completar

  • @jhancarlocamacuariaquino6280
    @jhancarlocamacuariaquino6280 2 года назад

    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?

  • @omarjunior26
    @omarjunior26 4 года назад

    Hola, que tema usas??

  • @daioncode862
    @daioncode862 Год назад

    Amigo ya hana pasdo 2 años podrias integrarse server-side por favor muchos lo necesitamos

  • @romuloalves9349
    @romuloalves9349 4 года назад

    Ótimo vídeo parabéns 👏.

  • @jeiko334
    @jeiko334 3 года назад

    hola buenas noches sera que puedas subir el proyecto por aqui?

  • @Juan-uj5fs
    @Juan-uj5fs 2 года назад

    Buen video
    pero faltó la parte de renderSelectEntries()
    Saludos

    • @Juan-uj5fs
      @Juan-uj5fs 2 года назад

      Ya lo adiviné
      const html = [5,10,15].reduce((acc, item) => {
      return (acc += `${item}`);
      }, '');

  • @josetarrillochuquiruna3773
    @josetarrillochuquiruna3773 2 года назад

    puedo crear esos datos y colocarlo en un datatables ya incorparado en un sistema?

  • @Asgallu
    @Asgallu 4 года назад

    Buen video, se podría hacer datatable editable sin modal?. Es muy parecida a las de vuetify con vue.

    • @vidamrr
      @vidamrr  4 года назад

      puedes hacer la funcionalidad si no la tiene o si quieres que actue de otra forma

  • @kevinpuchaicela6737
    @kevinpuchaicela6737 4 года назад

    esta muy bien, pero seria posible que hagas un video con el mismo programa con paradigma funcional? sin usar POO¿?

    • @oshoosho4604
      @oshoosho4604 Год назад +1

      de casualidad no quieres también un par de cervezas?

  • @pedro-j
    @pedro-j 3 года назад

    @Vida MRR ¿cómo sería si la tabla se carga con datos que viene de una consulta por PHP?

    • @vidamrr
      @vidamrr  3 года назад

      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

    • @pedro-j
      @pedro-j 3 года назад

      @@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.

    • @magingonzalo5062
      @magingonzalo5062 Год назад

      @@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

  • @noeliafernanda1061
    @noeliafernanda1061 Год назад

    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

  • @mathiasmendoza5864
    @mathiasmendoza5864 3 года назад +1

    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?

    • @luisdeft660
      @luisdeft660 2 года назад

      pudiste resolverlo?
      necesito algo igual jajaja XD

  • @lindapaz9272
    @lindapaz9272 Год назад

    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' : ...)

  • @alejandromartinezramirez3312
    @alejandromartinezramirez3312 3 года назад

    Hay una dependencia para hacerlo en React?

    • @vidamrr
      @vidamrr  3 года назад +1

      No pero sí tendrías que cambiar la lógica para que sea reactiva y que manejes estado

  • @jazo2212
    @jazo2212 Год назад

    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')

  • @edgarnapoles6578
    @edgarnapoles6578 2 года назад +1

    hay algunas partes cortadas...

  • @jazo2212
    @jazo2212 Год назад

    El 95% de los videos tutoriales en RUclips 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.

  • @SanchayanPackiyanathan
    @SanchayanPackiyanathan 4 года назад

    Amigo no se alcanzo ver el tema de funcion renderSelectEntries() gracias!!!

    • @depression4603
      @depression4603 3 года назад

      x2

    • @pedro-j
      @pedro-j 3 года назад +1

      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.

    • @SanchayanPackiyanathan
      @SanchayanPackiyanathan 3 года назад +1

      @@pedro-j Gracias !!!

    • @pedro-j
      @pedro-j 3 года назад +1

      @@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!! :)

    • @SanchayanPackiyanathan
      @SanchayanPackiyanathan 3 года назад +1

      @@pedro-j vale vale!!!

  • @giovannidirosa5459
    @giovannidirosa5459 2 года назад +1

    que mentiroso eres. no colocaste el renderSelectEntries

    •  Год назад

      en los comentarios esta escrito