Designing Contact us page using ASP.NET and C#

Introduction

A contact us page contains some information about visitor who visit the site and he/she want to contact site- administrator. It contains some fields such as Message subject , Body, Reply name and Reply email.

A simple snap of the contact us page.

Designing Contact us
For designing this type of contact us page first we should take a webform and after that drop some controls onit.
Designing methodology 
Step-1 : Take a webform named as "contact.aspx"
Step-2 :  For writing Contact Us , we should take division tag  <div> </div>
for example 
<div>
    <h2>Contact us</h2>
    </div>

Step-3 : Drop one label control in second division tag with blank text for display result message.

<div style="text-align :center ; background-color :Green" >
        <asp:Label ID="ResultLabel" runat="server" Text=""></asp:Label>

    </div>

Step-4 : Place Label , TextBox with proper validation control on design form.
<div>
        <table style="width: 100%;">
            <tr>
                <td class="style1">
                    &nbsp;
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
                        ControlToValidate="msubtxt" ForeColor="Maroon" ValidationGroup="c1">*</asp:RequiredFieldValidator>
                    &nbsp;Message Subject :
                </td>
                <td>
                    &nbsp;<asp:TextBox ID="msubtxt" runat="server" TabIndex="1"
                        ValidationGroup="c1" Width="222px"></asp:TextBox>
                </td>
                <td>
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td class="style1" valign="top">
                    &nbsp;
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
                        ControlToValidate="bdytxt" ForeColor="Maroon" ValidationGroup="c1">*</asp:RequiredFieldValidator>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Body:</td>
                <td>
                    &nbsp;<asp:TextBox ID="bdytxt" runat="server" Height="87px"
                         TabIndex="2" TextMode="MultiLine"
                        ValidationGroup="c1" Width="223px"></asp:TextBox>
                </td>
                <td>
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td class="style1" valign="top">
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server"
                        ControlToValidate="rplynmetxt" ForeColor="Maroon" ValidationGroup="c1">*</asp:RequiredFieldValidator>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Reply name:</td>
                <td>
                    <asp:TextBox ID="rplynmetxt" runat="server" TabIndex="3" ValidationGroup="c1"
                        Width="222px"></asp:TextBox>
                </td>
                <td>
                    &nbsp;</td>
            </tr>
            <tr>
                <td class="style1" valign="top">
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server"
                        ControlToValidate="rplyemltxt" ForeColor="Maroon" ValidationGroup="c1">*</asp:RequiredFieldValidator>
&nbsp;<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
                        ControlToValidate="rplyemltxt" ForeColor="Maroon"
                        ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"
                        ValidationGroup="c1">*</asp:RegularExpressionValidator>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Reply Email:</td>
                <td>
                    <asp:TextBox ID="rplyemltxt" runat="server" TabIndex="4" ValidationGroup="c1"
                        Width="222px"></asp:TextBox>
                </td>
                <td>
                    &nbsp;</td>
            </tr>
            <tr>
                <td class="style1" valign="top">
                    &nbsp;</td>
                <td>
                    <asp:Button ID="Button1" runat="server" Text="Send" ValidationGroup="c1"
                        onclick="Button1_Click" />
&nbsp;<asp:Button ID="Button2" runat="server" Text="Cancel" ValidationGroup="c1" />
                </td>
                <td>
                    &nbsp;</td>
            </tr>
        </table>
   
   

    </div>
Design View
Designing Contact us page using ASP.NET and C#

Code View

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Net.Mail;

public partial class contact : System.Web.UI.Page
{
   
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void Button1_Click(object sender, EventArgs e)
    {

        try
        {
            MailMessage msg = new MailMessage();
            msg.From = new MailAddress(rplyemltxt.Text);
            msg.To.Add("Email id here");
            msg.Subject = msubtxt.Text;
            msg.Body = "Name:" + rplynmetxt.Text + "<br/> Email : " + rplyemltxt.Text + "<br/>Subject :" + msubtxt.Text + "<br/>Contents :" + bdytxt.Text;
            msg.IsBodyHtml = true;
            SmtpClient smt = new SmtpClient("smtp.gmail.com", 587);
            smt.EnableSsl = true;
            smt.Credentials = new System.Net.NetworkCredential("Email id here", "your account password ");
            smt.Send(msg);
            ResultLabel.Text = "Send Message";
        }
        catch (Exception ex)
        {
            ResultLabel.Text = ex.Message;
        }



    }
    protected void Button2_Click(object sender, EventArgs e)
    {
        msubtxt.Text = "";
        bdytxt.Text = "";
        rplyemltxt.Text = "";
        rplynmetxt.Text = "";

    }
}


Note :Read carefully about above mentioned code
msg.To.Add("Email id here"); // pass your gmail id 

 smt.Credentials = new System.Net.NetworkCredential("Email id here""your account password ");  // again pass same gmail id and pass here in the code which is mentioned above.

Output of the Contact page
Designing Contact us page using ASP.NET and C#

Email Output
Designing Contact us page using ASP.NET and C#

Designing Contact us page using ASP.NET and C# Designing Contact us page using ASP.NET and C# Reviewed by Jacob Lefore on October 07, 2013 Rating: 5

No comments