Here is a couple of nice articles from my good friend Shaw, who hasn’t installed the WordPress bar on his blog so i have to reblog manually (ggrrwww) . But hey, they are good helpful articles worthy of your eyes.
Copying XML data from a SQL query – Article that describes a nice way of getting the XML stored in a SQL (Server 2005+) database via a query.
Check them out, and Shaw’s other Code Posts, well worth the lunchtime read.
Over the last few months i have done the following blog posts to explain how to handle images using MVC and various technologies like JQuery and Entity Framework. Now the majority of hits i receive are concerning these blogs posts, so obviously Image Handling is a common Achilles heel. The posts are also being referenced in forums to answer Image related questions. So i have decided to create a Open Source project which combines all of these blog posts into one solution for people to use. This project can be found here for anyone who wants to use it:
At the moment it includes everything i have blogged about and shows you how to extend the RegisterModel to include adding Images when registering a new user. I will be adding the following to the project moving forward as i want this to an organic project that grows:
- Adding Thumbnails to the database and displaying these
- A details page of users so you can view their details and the images – A User Dashboard for the Admin
- A Image FileResult.
- A PDF document explaining what the Project does and where.
MY ORIGINAL BLOG POSTS – Image Handlers – JQuery/ASP.NET/SQL DB & Entity Framework (MVC3)
Tutorial 1 – Image Preview – JQuery
Tutorial 2 – Image Preview – HTML Helpers
Tutorial3 – Upload Image – SQL Server & Entity Framework
Tutorial 4 – Images – Downloading Images
Tutorial 5 – Thumbnail Support
UPDATE: I have now combined all my MVC Image Handling blog posts into a Open Source Project. Feel free to check this out once you have read the post.
Original Blog Post:
The last post i described how to create a HTML Helper for Image Previewing. This time around we will be uploading an image to a Database, which is handled little differently than normal CRUD operations.
The following block of code shows my Create action method within my UserProfile controller:
1: public ActionResult Create(UserProfile userprofile,
2: HttpPostedFileBase imageLoad2)
4: var profileimage = new Medium();
6: if (imageLoad2 != null)
8: using (Image img =
11: //--Initialise the size of the array
12: byte file = new byte[imageLoad2.InputStream.Length];
14: //--Create a new BinaryReader and set the InputStream
//-- for the Images InputStream to the
16: //--beginning, as we create the img using a stream.
17: BinaryReader reader =
18: imageLoad2.InputStream.Seek(0, SeekOrigin.Begin);
20: //--Load the image binary.
21: file = reader.ReadBytes((int)imageLoad2.
23: //--Create a new image to be added to the database
25: profileimage.Created_Date = DateTime.Now;
26: profileimage.Source = file;
27: profileimage.File_Size = imageLoad2.ContentLength;
28: profileimage.File_Name = imageLoad2.FileName;
29: profileimage.Content_Type = imageLoad2.ContentType;
30: profileimage.Height = img.Height;
31: profileimage.Width = img.Width;
32: #if DEBUG
33: profileimage.Record_Status = "T"; //--Testing.
35: profileimage.Record_Status = " ";/--Live.
43: if (ModelState.IsValid)
49: return RedirectToAction("Index", "Home");
53: var viewModel = new UserProfileViewModel
55: UserProfile = userprofile,
56: UserTypes = userTypes
59: return View(userprofile);
This method creates has two parameters, the model UserProfile, and the HttpHostedFileBase imageLoad2 is the file posted. Have a look at the previous post about building the HTML.
NB: the parameter name imageLoad2 needs to be the name of the input file from the view so that is is bound (using the MVC Model Binding). If you used a different name the parameter would be null.
The method creates a Entity Framework model Medium, which is my class to describe the SQL Table which holds the Images. The images are saved within SQL as varbinary(MAX). Quite easy really, create a BinaryReader to convert the image stream to binary, then using the EF AddObject to the entity set, then save it to the table.
There we have it. Join me next time for downloading the image, using another custom HTML Helper.