Plugin to upload multiple images

Asked

Viewed 1,142 times

2

I have the following classes in my project.

Galeria and Fotos

I have a ViewModel where I take the data from Galeria and data from Fotos.

When doing Submit (normal, not asynchronous Submit) Galeria and the Fotos with the ID of Galeria maid.

Everything is working perfectly, but depending on the amount of Images selected the page is stopped and no information of what is happening appears to the user.

I want to implement some Plugin to do this, I researched many but could not understand how I apply this my case in the examples I saw.

Every suggestion and welcome.

  • There is this one (myself I left as answer): http://answall.com/questions/13606/alguem-ja-conseguiu-utilizar-o-jquery-file-upload/13613#13613, only the language, but the plugin can be used in several languages

2 answers

1

You can use the Plupload, a very good plugin to upload multiple files!

If the user browser supports HTML5 it uses, if not support, it uses Flash, Silverlight, and finally if it does not support any of these, it uses HTML4 to select the multiple files.

There are several configurations available in it, including you can create yours. And displays individual and global progress bar, and thumbnails as well!

There is the possibility of setting up for him to break the file in parts, and sending part by part, and on the server it gathers everything. Example to send large files!

Its use is very simple and works in several languages, including I did a post explaining step by step how to use it with ASP . Net MVC follows the link:

Using Plupload with ASP . Net MVC

In need we are there to help!

0


A widely used plugin is the uploadify. Download the package and arrange in your application MVC Web, how are you in this html. The input guy file is named after Filedata that will be the same name redeemed in Action that will receive such a photo, and has a variable idAlbum that you can refer to your Album and when recording your photo work with this variable.

Html

@{ Layout = null; }
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>GravarFotos</title>
    <!--Ficaria assim a disposição-->
    <script src="~/Scripts/jquery-2.1.0.js"></script>
    <script src="~/Scripts/jquery.uploadify.js"></script>
    <link href="~/Content/uploadify.css" rel="stylesheet" />
    <!--Fim da diposição-->
</head>
<body>
    <div> 
        <input type="file" name="Filedata" id="Filedata" />
    </div>
    <script>
        var idAlbum = '1';
        $(function () {
            $('#Filedata').uploadify({
                'swf': '/Content/uploadify.swf',
                'uploader': '/Home/GravarFotos',
                'method': 'post',
                'formData': { 'idAlbum': idAlbum }
            });
        });
    </script>
</body>
</html>

Action Code

[HttpGet]
public ActionResult GravarFotos()
{
     return View();
}

[HttpPost]
public String GravarFotos(HttpPostedFileBase Filedata, int? idAlbum)
{
     Filedata.SaveAs(Server.MapPath("~/Fotos/") + Filedata.FileName);
     return "1";
}

There are more items in this plugin that can be configured, as demonstrated in this link.

References

Browser other questions tagged

You are not signed in. Login or sign up in order to post.