How to Get Content Type for Upload File in C#

Implementation Summary

1. Create a "tblMembers" table in your Database.
2. Create a new ASP.Internet MVC web application project called "ClubMember".
3. Create a Model called "MemberModel".
4. Create HTTPGET ActionMethod called "ContactForm".
5. Create a view of "ContactForm".
6. Use HTML File Upload control.
7. Create HTTPPOST ActionMethod called "ContactForm" to insert tape in tabular array and relieve file in Server.
8. Add together Linq To Sql class "ClubMember".
9. Insert a record into a database tabular array.

Step by step Implementation

In the to a higher place form, yous tin can see there are iv objects.

1. Proper noun Textbox
2. Phone Number Textbox
3. Image File Upload
4. Submit Push

Create a "tblMembers" table in the database.

1. USE [MbkTest]
2. Go
4. SET  ANSI_NULLS ON
5. Get
7. SET  QUOTED_IDENTIFIER ON
8. Get
10. Prepare  ANSI_PADDING ON
11. Get
13. CREATE TABLE  [dbo].[tblMembers](
14.     [MemberID] [int ] IDENTITY(1,1) Not NULL ,
15.     [MemberName] [varchar ](50) NULL ,
16.     [PhoneNumber] [varchar ](l) Nil ,
17.     [ImagePath] [varchar ](500) Cipher ,
18. PRIMARY KEY  CLUSTERED
19. (
20.     [MemberID]ASC
21. )WITH  (PAD_INDEX = OFF , STATISTICS_NORECOMPUTE = OFF , IGNORE_DUP_KEY = OFF , ALLOW_ROW_LOCKS = ON , ALLOW_PAGE_LOCKS = ON ) ON  [ PRIMARY ]
22. )ON  [ PRIMARY ]
24. Go
25. SET  ANSI_PADDING OFF
27. Go

Create a new ASP.Internet MVC project called "ClubMember".

Click on "Change Authentication".

Merely we are looking for the post-obit output.

Click on "Change Hallmark" button and select No Authentication.

We have created a project called "ClubMember". Now, nosotros are going to add "MemberModel".

Correct-click on "MODELS" binder or press CTRL+SHIFT+A to add together new Model (Grade).

Give Model Name: "MemberModel".

Code of MemberModel.cs

1. using Organization;
2. using Organization.Collections.Generic;
3. using System.Linq;
4. using System.Web;
6. namespace ClubMember.Models
7. {
8. public class  MemberModel
9.     {
10.         public  string Name { get; set; }
11. public  string PhoneNumber { get; set; }
12. public  string ImagePath { get; gear up; }
13. public  HttpPostedFile ImageFile { go; set; }
14.     }
15. }

At present, build your project by right-clicking on the project and selecting BUILD.

Now, switch to HOME Controller. Click on Controllers binder and double click on HOMECONTROLLER.CS file.

Create an activeness-method chosen CONTACTFORM.

By default, the Add together View dialog box will display as below.

Fill up the "Add VIEW" dialog box with the post-obit values.

Every bit you click on Add together button in VIEWS-->Abode folder CONTACTFORM.CSHTML file will be created.

Switch to CONTACTFORM.CSHTML file and press F5. The output screen is given beneath.

Now, let us modify the CSHTML code.

Switch to CONTACTFORM.CSHTML file,  practice the following changes and press F5.

Remove following code of ImagePath

1. @Html.EditorFor(model => model.ImagePath, new  { htmlAttributes = new  { @ grade  = "form-command"  } })
2. @Html.ValidationMessageFor(model => model.ImagePath,"" , new  { @ class  = "text-danger"  })

Add together the post-obit lines of code.

1. <input type= "file"  name= "ImageFile"  required />

The above code line is the HTML control for file uploading.

Equally we take changed and usedthe HTML File-Upload control named "ImageFile", so now, permit us change the model again to change the titles of fields similar this:

• Name = Member Proper name
• PhoneNumber = Phone / Mobile Number
• ImagePath = Upload File

Code of MemberModel.cs

1. using System;
2. using System.Collections.Generic;
3. using System.ComponentModel;
4. using Arrangement.ComponentModel.DataAnnotations;
5. using Arrangement.Linq;
6. using System.Web;
8. namespace ClubMember.Models
9. {
10. public course  MemberModel
11.     {
13.         [DisplayName("Member Proper name" )]
14. public  string Name { get; set; }
17.         [DisplayName("Telephone / Mobile Number" )]
18. public  string PhoneNumber { get; set; }
21.         [DisplayName("Upload File" )]
22. public  string ImagePath { get; prepare; }
24. public  HttpPostedFileBase ImageFile { get; set; }
25.     }
26. }

Note
DisplayName attribute comes afterwards using the following namespaces.

1. using System.ComponentModel;
2. using System.ComponentModel.DataAnnotations;

At present, again, switch to CONTACTFORM.CSHTML file, exercise the following changes and press F5.

Now, allow us switch once again to ContactForm.cshtml to change the following.

Line No. 10

@using (Html.BeginForm())

Change this to:

1. @using(Html.BeginForm( "ContactForm" , "Habitation" , FormMethod.Mail, new
2. {
3.     enctype ="multipart/form-data"
4. }))

Now, let us switch back to the controller to work on it.

1. [HttpPost]
2. public  ActionResult ContactForm(MemberModel membervalues)
3. {
5.     string FileName = Path.GetFileNameWithoutExtension(membervalues.ImageFile.FileName);
8.     string FileExtension = Path.GetExtension(membervalues.ImageFile.FileName);
11.     FileName = DateTime.Now.ToString("yyyyMMdd" )+ "-" +FileName.Trim()+ FileExtension;
14.     string UploadPath = ConfigurationManager.AppSettings["UserImagePath" ].ToString();
17.     membervalues.ImagePath = UploadPath + FileName;
20.     membervalues.ImageFile.SaveAs(membervalues.ImagePath);
22. return  View();
23. }

After updating the HTTPPOST code, now, it is time to create a new folder called "UserImages".

You tin see in the Solution Explorer folder that the "UserImages"  folder is created.

Now, open web.config file to add APPSETTING.

AppSetting exists under Configuration Tag.

1. <configuration>
2.   <appSettings>
3.     <add key="webpages:Version"  value= "3.0.0.0"  />
4.     <add key="webpages:Enabled"  value= "false"  />
5.     <add key="ClientValidationEnabled"  value= "true"  />
6.     <add key="UnobtrusiveJavaScriptEnabled"  value= "true"  />
7.     <add key="UserImagePath"  value= "D:\MBK\ClubMember\ClubMember\UserImages\"  />
8.   </appSettings>

In the higher up code, you can meet UserImagePath cardinal created with the value.

At present, fill the form.

Later on clicking on CREATE push and submitting the form, y'all can run across your selected file copied in the set binder in spider web.config.

Now, we are going to write the code to store other information of CONTACT Form details.

• Member Name
• Telephone/Mobile Number
• Epitome File Path

Correct-click on project proper name "ClubMember".

Select Data--->LINQ to SQL Classes. Give name "ClubMemberDataClasses.dbml".

Open ClubMemberDataClasses.dbml file and open Server Explorer.

Click on the red button that is "Connect to database". Every bit you click on this push button, you will get the following dialog box.

In the above dialog box, you take to provide a Database server proper name and Authentication level and afterward, select your database.

Now, you tin see database is opened in Server Explorer.

Now, drag and drop tblMembers inside ClubMemberDataClasses.dbml.

Now, switch back to HomeController to write INSERT record lawmaking into database table using LINQ TO SQL.

Code HomeController.cs

1. using ClubMember.Models;
2. using Organisation;
3. using System.Collections.Generic;
4. using System.IO;
5. using Organisation.Linq;
6. using System.Web;
7. using System.Web.Mvc;
8. using System.Configuration;
10. namespace ClubMember.Controllers
11. {
12. public class  HomeController : Controller
13.     {
14. public  ActionResult Index()
15.         {
16. return  View();
17.         }
19. public  ActionResult Most()
20.         {
21.             ViewBag.Message ="Your application description folio." ;
23. return  View();
24.         }
26. public  ActionResult Contact()
27.         {
28.             ViewBag.Bulletin ="Your contact folio." ;
30. return  View();
31.         }
33.         [HttpGet]
34. public  ActionResult ContactForm()
35.         {
37. return  View();
38.         }
40.         [HttpPost]
41. public  ActionResult ContactForm(MemberModel membervalues)
42.         {
44.             cord FileName = Path.GetFileNameWithoutExtension(membervalues.ImageFile.FileName);
47.             cord FileExtension = Path.GetExtension(membervalues.ImageFile.FileName);
50.             FileName = DateTime.Now.ToString("yyyyMMdd" )+ "-" +FileName.Trim()+ FileExtension;
53.             cord UploadPath = ConfigurationManager.AppSettings["UserImagePath" ].ToString();
56.             membervalues.ImagePath = UploadPath + FileName;
59.             membervalues.ImageFile.SaveAs(membervalues.ImagePath);
63. var  db = new  ClubMemberDataClassesDataContext();
65.             tblMember _member =new  tblMember();
67.             _member.ImagePath = membervalues.ImagePath;
68.             _member.MemberName = membervalues.Proper noun;
69.             _member.PhoneNumber = membervalues.PhoneNumber;
71.             db.tblMembers.InsertOnSubmit(_member);
72.             db.SubmitChanges();
74. return  View();
75.         }
77.     }
78. }

Code ContactForm.cshtml

1. @model ClubMember.Models.MemberModel
3. @{
4.     ViewBag.Title ="ContactForm" ;
5. }
7. <h2>ContactForm</h2>
10. @using (Html.BeginForm("ContactForm" , "Domicile" ,FormMethod.Post, new  { enctype= "multipart/course-data"  }))
11. {
12.     @Html.AntiForgeryToken()
14.     <divclass = "class-horizontal" >
15.         <h4>MemberModel</h4>
16.         <hr />
17.         @Html.ValidationSummary(true , "" , new  { @ course  = "text-danger"  })
18.         <divclass = "form-group" >
19.             @Html.LabelFor(model => model.Name, htmlAttributes:new  { @ grade  = "control-characterization col-md-two"  })
20.             <divclass = "col-md-ten" >
21.                 @Html.EditorFor(model => model.Name,new  { htmlAttributes = new  { @ form  = "form-control"  } })
22.                 @Html.ValidationMessageFor(model => model.Name,"" , new  { @ form  = "text-danger"  })
23.             </div>
24.         </div>
26.         <divgrade = "class-grouping" >
27.             @Html.LabelFor(model => model.PhoneNumber, htmlAttributes:new  { @ grade  = "control-label col-md-two"  })
28.             <divform = "col-physician-10" >
29.                 @Html.EditorFor(model => model.PhoneNumber,new  { htmlAttributes = new  { @ class  = "course-control"  } })
30.                 @Html.ValidationMessageFor(model => model.PhoneNumber,"" , new  { @ grade  = "text-danger"  })
31.             </div>
32.         </div>
34.         <divclass = "form-group" >
35.             @Html.LabelFor(model => model.ImagePath, htmlAttributes:new  { @ form  = "control-label col-md-2"  })
36.             <divform = "col-md-10" >
37.                 <input type="file"  proper noun= "ImageFile"  required />
38.             </div>
39.         </div>
41.         <divclass = "course-group" >
42.             <divclass = "col-md-get-go-ii col-md-10" >
43.                 <input type="submit"  value= "Create" grade = "btn btn-default"  />
44.             </div>
45.         </div>
46.     </div>
47. }
49. <div>
50.     @Html.ActionLink("Back to Listing" , "Index" )
51. </div>
53. @department Scripts {
54.     @Scripts.Render("~/bundles/jqueryval" )
55. }

Code MemberModel.cs

1. using System;
2. using System.Collections.Generic;
3. using System.ComponentModel;
4. using Organisation.ComponentModel.DataAnnotations;
5. using System.Linq;
6. using System.Web;
8. namespace ClubMember.Models
9. {
10. public class  MemberModel
11.     {
13.         [DisplayName("Member Name" )]
14. public  string Name { get; prepare; }
17.         [DisplayName("Telephone / Mobile Number" )]
18. public  string PhoneNumber { go; set up; }
21.         [DisplayName("Upload File" )]
22. public  string ImagePath { get; set; }
24. public  HttpPostedFileBase ImageFile { get; gear up; }
25.     }
26. }

Now, you can check in your SQL Server database tabular array if the tape is inserted or not.

Wait here. The above record is inserted successfully.

Thank you .

Happy Coding.

woodsandsorses.blogspot.com

Source: https://www.c-sharpcorner.com/article/asp-net-mvc-form-with-file-upload/

Share this post