Upload and store many images a to database and create thumbnails at once using ASP.Net MVC

Question

How can I upload many images at once (by open dialog and shift/ctrl) and store them to sql server database (create a record for each image) and then create thumbnails with ASP.Net MVC ?

How view and controller should be?? Thanks alot.

Answer 1

It seems from your question that you are going way over your head. You are asking questions about ASP.NET MVC, image treatment algorithms, SQL server and general web design all at once.

To avoid going into the nitty gritty of your question I'll simply explain what you need to do. You are going to need to do the research for this yourself because no amount of S.O. questions and answers will give you the appropriate technical knowhow.

You first need to have a database which can store images. Here is a little tutorial http://www.codeproject.com/Articles/354639/Storing-and-Retrieving-Images-from-SQL-Server-Usin.

That will probably take you a while. But once you are done that you will need to get into your project and start working on the basic architecture. What are your objects going to look like? What will the flow of your program be? One big question you will need to ask is how are you going to connect to your database? The answer should probably be Entity Framework. You need to look into using EF to transfer data from your server side code to your DB.

As far as your views and your controllers, controllers are where all the calculating and processing happens in your application, and views are almost like templates which display calculated data. You need to work out what data you want to pass back and forth. Generally speaking given the small amount of information that you have provided, the view will look like pretty much whatever you want it to look like, and the controller will have to take the image passed from the view, turn it into a thumbnail and then pass it (with EF) back to your database.

A lot of work, eh? ;)

Answer 2

You have to create 2 Classes: MainClass and MainClassViewModel

The main class has the property of images with a tagname, like:

public class MainClass
{
 [Key]
 public int MainClassId {get; set;}
 [DisplayName("Image 1")]
 public Bytes[] Image1 {get;set;}
}

Then you will need a ModelView (it's a class way to similar to the original just will have to change the type of "Bytes[]" to "HttpPostedFileBase":

  public class MainClassModelView
{
 [Key]
 public int MainClassId {get; set;}
 [DisplayName("Image 1")]
 public HttpPostedFileBase Image1 {get;set;}
}

and in your view you have to use this ModelView, in the 1st line:

 @model ApplicationName.Models.MainClassModelView

Then you have to use the view:

 @using (Html.BeginForm(null, null, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
  @Html.AntiForgeryToken()
  <div class="form-horizontal">
     <h4>MainClassView</h4>
     <hr />
       @Html.Images(m => m.Image1)
       @Html.ValidationMessageFor(model => model.Image1, "", new { @class = "text-danger" })
    </div>
</div>

   <div class="form-group">
      <div class="col-md-offset-2 col-md-10">
          <input type="submit" value="Create" class="btn btn-default" />
      </div>
  </div>
</div>
}