0

Tengo el siguiente codigo en una vista con el cual el suario selecciona imagenes

 <input type="file" id="files" class="fileuploader" style="display:none;" multiple />

con el siguiente codigo javascript el usuario puede previsualizar las imagenes, quitar o agregar mas

$('.fileuploader').change(function (event) {

        var files = event.target.files;
        var imgType = /image.*/;
        for (i = 0; i <= files.length; i++) {
            var reader = new FileReader();
            var file = files[i];
            if (!file.type.match(imgType)) {
                continue;
            }
            else {
                reader.onload = function (file) {
                    var fileContent = file.target.result;
                    cont++;
                    $('.box1').append('<div id="div' + cont + '" class="thumbnail box2" style="margin-bottom:0px;" ><img width="90" height="70" src="' + fileContent + '" name="img'+cont+'">'
                        + '<div class="box3" ><button  onclick="quitarImg(' + cont + ')" id="btn' + cont + '" type="button" class="btn btn-danger btn-xs" aria-label="Left Align" style="padding:0px 3px; line-height:15px;">'
                        + '<span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button></div ></div>');
                }
            }
            reader.readAsDataURL(this.files[i]);
});`

function quitarImg(numId) {
   var elementId = document.getElementById("div" + numId);
   elementId.remove();
   cont--;
}

si el usuario por ejemplo, selecciono 3 imagenes primero, las previsualizo, volvio a seleccionar otras dos imagenes y al final quito una imagen de las 5 que habia seleccionado como envio las 4 imagenes que al final el usuario decidio guardar a mi controlador para que las pueda guardar. Ya no puedo usar

 <input type="file" id="files" class="fileuploader" style="display:none;" multiple />introducir el código aquí

para recibirlas en el controlador con algo como esto

List<IFormFile> files

porque Input solo tiene referencia las ultimas dos imagenes y no las 4 que al final quedaron ya que el usuario se supone quito una. Como el codigo javascript genera algo como esto

<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/...//Z" name="img1" width="90" height="70">

habia pensado usar el valor del atributo src="" para enviarlo como parametro al controlador pero creo que no es posible. Lo otro que se me ocurre es usar sessionstorage pero la verdad no se como hacerlo (llevo dos semanas aprendiendo javascript y atorado con esto un poco mas de una semana). En resumen solo quiero enviar al controlador las imagenes finales despues de que el usuario agregue o quite algunas.

3
  • 1
    Deberías explicarte mejor, y poner ejemplos de tu código Commented el 2 jun. 2017 a las 7:20
  • Bienvenido a Stack Overflow en Español. lee cómo crear una buena pregunta. Debes editar tu pregunta con el código que hayas intentado, errores, etc. Debes agregar mas código. ¿qué usaste para lograr la funcionalidad que mencionas? edita tu pregunta. es.stackoverflow.com/tour es.stackoverflow.com/help/how-to-ask
    – Charly
    Commented el 2 jun. 2017 a las 11:47
  • Guilleromo modifique la pregunta. Ojala ahora si me halla explicado. Gracias!!
    – Daniel
    Commented el 3 jun. 2017 a las 5:55

1 respuesta 1

0
var url = document.getElementsByTagName("img")[0].getAttribute("src");
alert(url);

Tu pregunta no la entiendo bien, pero si quieres usar la url aquí te dejo como sacarla.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.