SUBIR ARCHIVOS CON DRAG AND DROP JAVASCRIPT

Поділитися
Вставка
  • Опубліковано 1 лют 2025

КОМЕНТАРІ • 62

  • @jpduron
    @jpduron 3 роки тому +1

    Genial!!! seguiré el tuto para mejorar el upload que tengo en puro PHP. Gracias por el esfuerzo!

  • @andadnacaustic3927
    @andadnacaustic3927 3 роки тому

    Wow, al fin encontré un vídeo en donde muestra como hacer estas cosas, muchas gracias por haber hecho esto :)

  • @ortegagarridojorgeandres3438
    @ortegagarridojorgeandres3438 3 роки тому +2

    Genial! ya quiero verlo

  • @Kanthollw
    @Kanthollw 3 роки тому

    Bro, excelente video, no conocía ciertas herramientas que usas en javascript para controlar los archivos. Sigue así!

  • @pasquinisebastian342
    @pasquinisebastian342 2 роки тому

    Buenisimo video! Excelente la explicación, lo pude aplicar en mi trabajo

    • @vidamrr
      @vidamrr  2 роки тому +1

      Excelente!! Que bueno que te sirvió 👏🏻👏🏻🎉

  • @ceroserio8810
    @ceroserio8810 3 роки тому +3

    Woow justo estaba buscando esto, pero tendré que esperar 4 días 😄

  • @juanbolanos5939
    @juanbolanos5939 2 роки тому

    Buenísimo tu video. Muchas gracias!!

  • @erika-Her-O
    @erika-Her-O 3 роки тому +1

    Buen video ,lo veré denuevo para seguir practicandolo💪🏼

  • @musicadefondo_oficial
    @musicadefondo_oficial 2 роки тому +1

    Iba bien hasta el minuto 15, despues parecia que estaba hablando chino... me tocara veerlo varias veces para entender
    ;v EXELENTE

  • @miguel900030
    @miguel900030 3 роки тому +1

    Un curso de CSS Grid como el que hiciste de Flexbox estaría genial 😁

  • @luisangellopezsanchez5470
    @luisangellopezsanchez5470 3 роки тому

    Excelente, justo lo que buscaba

  • @germanrodriguez8205
    @germanrodriguez8205 2 роки тому +2

    hola como esta una pregunta lo estoy implementado en un proyecto de .net pero reviso el tema y siempre en la funcion processFiles(file) me llega undefined al revisar con console.log,
    Le implemente un timeout pero sigue saliendo undefined

  • @Markovichgdl
    @Markovichgdl 7 місяців тому

    Gracias! me ayudo mucho a aterrizar barias cosas

  • @noeblackberry5209
    @noeblackberry5209 3 роки тому

    se ve bueno este tuto vamos a seguirlo

  • @andresporras1868
    @andresporras1868 2 роки тому +1

    Si quieren que al final siga cambiando de color tanto con el botón como arrastrando, comenten " dropArea.classList.remove("active");" en los eventos de "change" y "drop"

  • @ALCOCER2023
    @ALCOCER2023 3 роки тому +1

    Excelente, me encanta! Ahora, que cambios se podrían hacer para que en vez de imágenes fuesen Archivos?

    • @merlyndeikaroz1371
      @merlyndeikaroz1371 2 роки тому +2

      solamente en validationExtensions cambialo por application/pdf, si no sabes que archivo es el que ocupas pon esta alerta => alert("Archivos permitidos: PDF____"+docType);

    • @abcd4rio
      @abcd4rio Рік тому

      @@merlyndeikaroz1371 y si es para ambos ?

  • @xxhmmrxx281
    @xxhmmrxx281 3 роки тому

    Me suscribo eres el mejor, gracias :D

  • @minorsoft
    @minorsoft 2 роки тому +4

    ¿Cómo puedo agregar un botón para eliminar una imagen si me equivoque y cargue más imagenes de las que debía?

  • @alexyt
    @alexyt 3 роки тому +2

    hello, what extension do you use for javascript autocomplete code ?

  • @jo0nax
    @jo0nax 3 роки тому

    Buenísimo!!

  • @IsmaileichuYT
    @IsmaileichuYT 2 роки тому +2

    Donde esta el link para ver este codigo plis me urge
    lo intento buscar en la descripcion, me meto al link y nada

  • @oscarvarela4196
    @oscarvarela4196 3 роки тому

    Eres un crack bro

  • @yazmintrinidadfloreszunagu2703
    @yazmintrinidadfloreszunagu2703 2 роки тому

    buenas tardes me gusto el video y para subir y enviar solo archivos pdf es el mismo codigo solo tendria que cambiar algunas cosas verdad ??

  • @vice2381
    @vice2381 3 роки тому

    Muy bueno!

  • @DanielHaro-hv3mv
    @DanielHaro-hv3mv Рік тому +1

    Hola. He probado el codigo. Funciona bien cuando el servidor de destino es local pero no funciona cuando el servidor de destino es remoto. ¿Cual podría ser el motivo?

    • @vidamrr
      @vidamrr  Рік тому

      Estás en el mismo dominio? Sino checa que no tengas problemas de CORS, cuando mandas de un dominio a otro generalmente se van a bloquear tus solicitudes

  • @rnt2010
    @rnt2010 3 роки тому +2

    A ver si puedes poner tambien otro boton que sea “abrir camara del telefono y que suba la foto directamente”

  • @lideroverwatch6825
    @lideroverwatch6825 2 роки тому

    Buenas, primero buen video. segundo, te consulto, como podria implementar el eliminar? . lo puse dentro del const image = `... ` pero no hace nada, si cambio a : const image = `... ` me dice que no existe la funcion. entiendo que es porque pierde el contexto de donde esta. tenes alguna sugerencia? graciaas

  • @cesarcarmona2627
    @cesarcarmona2627 3 роки тому

    Hola, una pregunta cual sería a tu consideración la mejor manera de manipular información como los id's con javascript solamente, por ejemplo para saber el id del registro que estoy editando, evitar ponerlo en un campo hidden tu que me recomendarías con sólo javascript, veo que en frameworks ya se hace casi automáticamente ya que examino el código fuente en el navegador y no veos esos campos, pero no logro realizar lo mismo solo con javascript y html. Gracias

    • @vidamrr
      @vidamrr  3 роки тому

      El tema de JavaScript solito es que podrías manipular las datos, lo que debes hacer es guardar los ids en algún lado y ponerlos en los elementos, pero cada que necesites obtener el Id consultarlo desde la variable o arreglo donde están tus elementos. Así aunque el usuario modifique el HTML tú tienes tus datos en memoria

    • @cesarcarmona2627
      @cesarcarmona2627 3 роки тому

      @@vidamrr Entonces los guardo en una variable global en JavaScript y acceder a ella posteriormente verdad. Muchas gracias

  • @CarlosRodriguez-ww1fv
    @CarlosRodriguez-ww1fv 2 роки тому

    Se puede abrir el explorar de archivos con js? 🤔

  • @testerbennix4221
    @testerbennix4221 2 роки тому

    consulta: una vez subidas las imagenes se pueden descargar?

  • @styveenrizo3962
    @styveenrizo3962 Рік тому

    cual de todos los enlaces es para descargar bro , solo tienes cursos de node,php y una web

  • @bashita159
    @bashita159 3 роки тому

    si el cargue se realizara al servidor con php como seria mas o menos?

  • @hugoisaiasalvarezgarcia2016
    @hugoisaiasalvarezgarcia2016 3 роки тому

    Que extensión utilizas para las sugerencias de código mientras vas escribiendo

    • @vidamrr
      @vidamrr  3 роки тому +2

      Es GitHub copilot, tienes que registrarte a la beta para que la extensión te funcione

  • @oscarag4655
    @oscarag4655 2 роки тому

    muy bien hermano gracias!, solo como validas los archivos .csv?, cuando intento validarlos me manda directamente al else

    • @andersoncoronado1835
      @andersoncoronado1835 2 роки тому

      Un poco tarde, pero puedes intentar con "const validExtensions = [ 'text/csv'] "
      Puedes ir revisando las extensiones con : console.log(file.type);

  • @yoelgtz9238
    @yoelgtz9238 2 роки тому

    Es posible copiar y pegar el archivo en un input?

  • @logan_business
    @logan_business 3 роки тому

    Hola me gustaría saber si los datos enviados por Fetch se pueden recoger por un script de PHP, gracias.

    • @vidamrr
      @vidamrr  3 роки тому +1

      Si, en PHP los datos los recibes con $_POST como siempre

  • @Gulliver626
    @Gulliver626 Рік тому

    y para que solo se pueda 1?

  • @lucianodallo8785
    @lucianodallo8785 2 роки тому

    Exelente el video!!
    al llegar al servidor me surge este problema: ReferenceError: document is not defined
    at Object. (F:\Ubicación\index.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1126:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1180:10)
    at Module.load (node:internal/modules/cjs/loader:1004:32)
    at Function.Module._load (node:internal/modules/cjs/loader:839:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:17:47
    [nodemon] app crashed - waiting for file changes before starting...

  • @josecb481
    @josecb481 2 роки тому

    Pero solo sirve para fotos.. Nop puedo subir videos.. Y como podria eliminar los que ya seleccione??

    • @vidamrr
      @vidamrr  2 роки тому

      Eso es otro alcance, el video solo es para subir archivos, pero para eliminarlos tienes que igual implementar en el backend la funcion

    • @josecb481
      @josecb481 2 роки тому

      @@vidamrr mmm no tienes un video de eso?? amigo

  • @josesupreme4
    @josesupreme4 2 роки тому

    esta bueno el video, pero no me funciona la parte del FileReader() cuando se realiza el fileReader.addEventListener, a alguien mas le ha pasado? estoy dandole vuelta y aun no veo el problema.

    • @josesupreme4
      @josesupreme4 2 роки тому

      por si acaso, no se disparaba el evento porque habia colocado . fileReader.readAsDataURL(file) dentro del evento

  • @juanpablohewitt7613
    @juanpablohewitt7613 2 роки тому

    no me funciona el data transfer :(

  • @jadelea5348
    @jadelea5348 Рік тому

    Nada entendí algo fácil,donde saco eso

  • @alejandroiosefosorio4261
    @alejandroiosefosorio4261 2 роки тому

    Uncaught TypeError: files is undefined a alguien le paso ?

    • @vidamrr
      @vidamrr  2 роки тому +1

      revisa el nombre de tu variable, el error dice que file no existe

  • @EmilioVisionTV
    @EmilioVisionTV 2 роки тому

    "click" es nulo dice la consola

  • @huariamazgacontigo
    @huariamazgacontigo Рік тому

    Subir mis archivos y descargar