Multiple Files Upload Asp.Net MVC File Uploader Demo in MVC.

Description:-

            In this Example we Explain that How to Upload Multiple File At a time in MVC.

In previous Example we Explain that how to upload single file but in this example the different is multiple file.

Here we use the SaveData Function for Upload Multiple File in database at a time and in View page when click on Submit button and form is submited to the server we call the SaveData Action method that are used to store multiple file and save to the database.

here is a code for SaveData Action Result Method

[HttpPost]

        public ActionResult SaveData(MultipleFileUploadModel containers, IEnumerable<HttpPostedFileBase> files)

        {

            foreach (var file in files)

            {

                if (file.ContentLength > 0)

                {

                    var fileName = Path.GetFileName(file.FileName);

                    var path = Path.Combine(Server.MapPath("~/Uploads"), fileName);

                    file.SaveAs(path);

                }

            }

            //Save model

            ViewData["message"] = "Uploaded Successfully";

            return View("Index");

        }

What is Use of [HttpPost] in MVC:-

The POST request method is used to request that a web server accepts the data enclosed in the request message's body for storage

Some important point about data submitted using HttpPost

A Submit button will always initiate an HttpPost request.

Data is submitted in http request body.

Using Post Data is not visible in the url when form is Submited.

It is more secured but slower as compared to GET.

It use heap method for passing form variable

It can post unlimited form variables or data.

To show Example of How to Upload Image or File in Asp.Net Click Here Upload File and Bind to Gridview in Asp.Net

To Show Example of How to Upload File in MVC Application then click here upload Image and bind to Gridview in MVC

To show Example of How to Upload Multiple File in MVC Application then click here upload multiple File in MVC

How to upload File and Fetch file from SqlServer and bind to Gridview fetch file from Sqlserver and bind to Gridview

First create a class file in Model Folder with the name is MultipleFileUploadModel.cs

MultipleFileUploadModel:-

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

namespace MVCFileUpload.Models

{

    public class MultipleFileUploadModel

    {

        public string MyProperty1 { get; set; }

        public string MyProperty2 { get; set; }

        public string MyProperty3 { get; set; }

        public string FileName { get; set; }

        public string FileName1 { get; set; }

    }

}

Now Create a Controller in Controller Folder with the name is MultipleFileUploadController.cs

MultipleFileUploadController.cs:- 

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using MVCFileUpload.Models;

using System.IO;

namespace MVCFileUpload.Controllers

{

    public class MultipleFileUploadController : Controller

    {

        //

        // GET: /MultipleFileUpload/

        public ActionResult Index()

        {

            return View();

        }

        [HttpPost]

        public ActionResult SaveData(MultipleFileUploadModel containers, IEnumerable<HttpPostedFileBase> files)

        {

            foreach (var file in files)

            {

                if (file.ContentLength > 0)

                {

                    var fileName = Path.GetFileName(file.FileName);

                    var path = Path.Combine(Server.MapPath("~/Uploads"), fileName);

                    file.SaveAs(path);

                }

            }

            //Save model

            ViewData["message"] = "Uploaded Successfully";

            return View("Index");

        }

    }

}

Now Create a Index.cshtml File or Create view in MultipleFileUpload with name is Index.cshtml.

  Index.cshtml:-

@model MVCFileUpload.Models.MultipleFileUploadModel

@{

    ViewBag.Title = "Index";

    Layout = "~/Views/Shared/_Layout.cshtml";

}

<style>

    div{padding:5px;}

</style>

<h2>Index</h2>

@ViewData["message"]

@using (Html.BeginForm("SaveData", "MultipleFileUpload", FormMethod.Post, new { enctype = "multipart/form-data" }))

{

    <div>

    @Html.LabelFor(x => x.MyProperty1)

    @Html.EditorFor(x => x.MyProperty1) </div>

    <div>

    @Html.LabelFor(x => x.MyProperty1)

    @Html.EditorFor(x => x.MyProperty2)</div>

    <div>

    @Html.LabelFor(x => x.MyProperty1)

    @Html.EditorFor(x => x.MyProperty3)</div>

   

   

    <div><input type="file" name="files" id="file" /> </div>

    <div><input type="file" name="files" id="file1" /> </div>

    <input type="submit" value="submit" />

}