In this article I will explain with an example, how to send email using
Contact Us Form in
ASP.Net MVC Razor.
The
Contact Us Form contains some
TextBox controls, a Rich
TextBox and a
FileUpload control to attach file.
When the Send
Button is clicked, the values from the
TextBox fields are embedded into
HTML string and the
HTML string is send as
Email along with the Attachment in
ASP.Net MVC Razor.
Mail Server Settings in Web.Config file
The following Mail Server settings need to be saved in the
Web.Config file.
<system.net>
<mailSettings>
<smtp deliveryMethod="Network" from="sender@gmail.com">
<network
host="smtp.gmail.com"
port="587"
enableSsl="true"
userName="sender@gmail.com"
password="GMAILor2STEP-PASSWORD"
defaultCredentials="true"/>
</smtp>
</mailSettings>
</system.net>
MailMessage Class Properties
Following are the required properties of the MailMessage class.
From – Sender’s email address.
To – Recipient(s) Email Address.
CC – Carbon Copies. (If any)
BCC – Blind Carbon Copies. (If any)
Subject – Subject of the Email.
Body – Body of the Email.
IsBodyHtml – Specify whether body contains text or HTML mark up.
Attachments – Attachments. (If any)
ReplyTo – ReplyTo Email address.
SMTP Class Properties
Following are the properties of the SMTP class.
Host – SMTP Server URL. (Gmail: smtp.gmail.com)
EnableSsl – Specify whether your host accepts SSL Connections. (Gmail: True)
UseDefaultCredentials – Set to True in order to allow authentication based on the Credentials of the Account used to send emails.
Credentials – Valid login credentials for the SMTP server. (Gmail: email address and password)
Port – Port Number of the SMTP server. (Gmail: 587)
Model
The Model class consists of the following properties.
public class ContactFormModel
{
public string Name { get; set; }
public string Subject { get; set; }
public string Email { get; set; }
public string Body { get; set; }
public HttpPostedFileBase Attachment { get; set; }
}
Namespaces
You will need to import the following namespaces.
using System.Net;
using System.Net.Mail;
using System.Configuration;
using System.Net.Configuration;
Controller
The Controller consists of following Action methods.
Action method for handling GET operation
Inside this Action method, simply the View is returned.
Action method for handling POST operation
Inside this Action method, the posted values are captured through the ContactFormModel class object.
The Sender email address (from) is fetched from the
SmtpSection of the
Web.Config file, the Subject and Body are fetched from their respective
Model properties.
If a file is attached, then it is added as attachment to the Attachments List of the MailMessage object and all these values are set into an object of the MailMessage class.
Then, an object of the
SmtpClient class is created and the values of
Host,
Port,
EnableSsl and
UseDefaultCredentials are fetched from the
SMTP section of the
Web.Config file and set to the respective properties of
SmtpClient class along with the Credentials.
Note: It is necessary to use the sender’s email address credentials while defining the
Gmail SMTP Server Credentials as
Gmail the sender’s email address must be same as the
Gmail Username specified in credentials.
Finally, the
Send method is executed which sends the
Email and a success message is set to a
ViewBag object.
public class HomeController : Controller
{
// GET: Home
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult Index(ContactFormModel model)
{
//Read SMTP section from Web.Config.
SmtpSection smtpSection = (SmtpSection)ConfigurationManager.GetSection("system.net/mailSettings/smtp");
using (MailMessage mm = new MailMessage(smtpSection.From, "admin@aspsnippets.com"))
{
mm.Subject = model.Subject;
mm.Body = "Name: " + model.Name + "<br /><br />Email: " + model.Email + "" + model.Body;
if (model.Attachment.ContentLength > 0)
{
string fileName = Path.GetFileName(model.Attachment.FileName);
mm.Attachments.Add(new Attachment(model.Attachment.InputStream, fileName));
}
mm.IsBodyHtml = true;
using (SmtpClient smtp = new SmtpClient())
{
smtp.Host = smtpSection.Network.Host;
smtp.Port = smtpSection.Network.Port;
smtp.EnableSsl = smtpSection.Network.EnableSsl;
smtp.UseDefaultCredentials = smtpSection.Network.DefaultCredentials;
smtp.Credentials = new NetworkCredential(smtpSection.Network.UserName, smtpSection.Network.Password);
smtp.Send(mm);
}
}
ViewBag.Message = "Email sentsucessfully.";
return View();
}
}
View
HTML Markup
Inside the View, in the very first line the ContactFormModel class is declared as model for the View.
The View consists of an HTML Form which has been created using the Html.BeginForm method with the following parameters
ActionName – Name of the Action. In this case the name is Index.
ControllerName – Name of the Controller. In this case the name is Home.
FormMethod – It specifies the Form Method i.e. GET or POST. In this case it will be set to POST.
Note: For more details in creating
HTML TextBox,
TextArea,
FileUpload element in ASP.Net MVC, please refer following articles.
When the Send Button is clicked, the Form gets submitted and the Model object is sent to the Controller.
Finally, the Send Button is clicked, the Form gets submitted and the Email is sent.
@model Contact_Form_MVC.Models.ContactFormModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
@using (Html.BeginForm("Index", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="width:80px">Name:</td>
<td><input type="text" name="Name" /></td>
</tr>
<tr>
<td>Subject:</td>
<td><input type="text" name="Subject" /></td>
</tr>
<tr>
<td>Email:</td>
<td><input type="text" name="Email" /></td>
</tr>
<tr>
<td valign="top">Body:</td>
<td><textarea cols="20" rows="10" name="Body"></textarea></td>
</tr>
<tr>
<td>Attachment:</td>
<td><input type="file" name="Attachment" /></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="Send" asp-page-handler="Submit" /></td>
</tr>
</table>
<br />
<span style="color:green">@ViewBag.Message</span>
}
</div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.0.20/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({ selector:'textarea', width: 300 });
</script>
</body>
</html>
Errors while sending Email using Gmail
The following error occurs when you try to send email using
Gmail credentials in your ASP.Net MVC application.
The SMTP server requires a secure connection or the client was not authenticated. The server response was: 5.5.1 Authentication Required. Learn more at
Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.
Exception Details: System.Net.Mail.SmtpException: The SMTP server requires a secure connection or the client was not authenticated. The server response was: 5.5.1 Authentication Required. Learn more at
Solution
Screenshots
The Contact Us Form
![Contact Us Form in ASP.Net MVC]()
The received email
![Contact Us Form in ASP.Net MVC]()
Downloads
