How to List added photos in the view?

0

I have the following code in my View that takes the path of the photo, and saves it in the bank.

@using (Html.BeginForm("Upload", "PessoaFoto", FormMethod.Post, new { enctype = "multipart/form-data" }))
    {
        @Html.Hidden("idPessoa", Request.QueryString["idPessoa"])
        <input type="file" name="file" />
        <input type="submit" />

    }

How do I list these photos in View as I add them?

What I want is that as I add the photos in my view they appear so that I can see them.

For example:

    
asked by anonymous 13.10.2016 / 22:30

1 answer

0

There are several ways you can do what you want. The simplest thing is to have a img element in your code, and by selecting the image (in this example I'm using .change() ) you add the image.

A basic example would be this:

function readURL(input) {
  if (input.files && input.files[0]) {
    var reader = new FileReader();
    reader.onload = function(e) {
      $('#preview').attr('src', e.target.result);
    }
    reader.readAsDataURL(input.files[0]);
  }
}

$("#File").change(function() {
  readURL(this);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><formid="form1" runat="server">
  <input type='file' id="File" />
  <img id="preview" src="#" />
</form>

This question has several ways to do this, including the one I've shown above.

    
13.10.2016 / 23:09