{"id":221,"date":"2015-09-05T11:10:01","date_gmt":"2015-09-05T15:40:01","guid":{"rendered":"http:\/\/gregorgonzalez.com.ve\/blog\/?p=221"},"modified":"2015-09-05T11:35:58","modified_gmt":"2015-09-05T16:05:58","slug":"pre-visualizar-imagenes-antes-de-enviar-formulario","status":"publish","type":"post","link":"https:\/\/gregorgonzalez.com.ve\/blog\/pre-visualizar-imagenes-antes-de-enviar-formulario\/","title":{"rendered":"Pre visualizar im\u00e1genes antes de enviar formulario"},"content":{"rendered":"<p>El siguiente c\u00f3digo JQuery, muestra las im\u00e1genes que intentas cargar a trav\u00e9s de un formulario. Com\u00fanmente el proceso completo seria utilizar un iframe, cargar la imagen al servidor y luego mostrarla, pero para evitarnos la carga de archivos y m\u00e1s sino sabemos si el usuario va a enviar el formulario, podemos utilizar este c\u00f3digo Javasript\/JQuery para pre visualizar las fotos antes del env\u00edo, cargando la imagen actual del disco y dejando libre el lado del servidor.<\/p>\n<p>Usa una base para cargar m\u00faltiples archivos en el formulario, por lo tanto solo toca realizar la parte del servidor para guardarlas.<a href=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/cargar_multiple_formulario.png\"><img loading=\"lazy\" decoding=\"async\" class=\" size-full wp-image-223 aligncenter\" src=\"http:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/cargar_multiple_formulario.png\" alt=\"cargar_multiple_formulario\" width=\"396\" height=\"331\" srcset=\"https:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/cargar_multiple_formulario.png 396w, https:\/\/gregorgonzalez.com.ve\/blog\/wp-content\/uploads\/cargar_multiple_formulario-300x251.png 300w\" sizes=\"(max-width: 396px) 100vw, 396px\" \/><\/a><\/p>\n<p>Puedes ver un ejemplo funcional en el siguiente JSFiddle:<\/p>\n<iframe style=\"width: 100%; height: 600px\" src=\"http:\/\/jsfiddle.net\/ENSASKE\/kwvjw8kq\/embedded\/result,js,html\/\" allowfullscreen=\"allowfullscreen\" frameborder=\"0\"><\/iframe>\n","protected":false},"excerpt":{"rendered":"<p>El siguiente c\u00f3digo JQuery, muestra las im\u00e1genes que intentas cargar a trav\u00e9s de un formulario. Com\u00fanmente el proceso completo seria utilizar un iframe, cargar la imagen al servidor y luego mostrarla, pero para evitarnos la carga de archivos y m\u00e1s sino sabemos si el usuario va a enviar el formulario, podemos utilizar este c\u00f3digo Javasript\/JQuery [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"categories":[34,94],"tags":[96,98,99,100,97],"_links":{"self":[{"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/posts\/221"}],"collection":[{"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/comments?post=221"}],"version-history":[{"count":0,"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/posts\/221\/revisions"}],"wp:attachment":[{"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/media?parent=221"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/categories?post=221"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gregorgonzalez.com.ve\/blog\/wp-json\/wp\/v2\/tags?post=221"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}