Skip to main content

How to Create ContactUs page using Rich TextBox in Asp.Net

Introduction:

As we know, ASP.NET lacks a control that we need most, RichText editor.

If you are trying to create an application or website with Admin Panel or Blog or Forum Website or some such project for Web in ASP.NET platform, we need RichText Editor.
To overcome this, we can use many open source JavaScript based editors, like Tiny MCE, FCKEditor, etc.

here we are using TinyMCE, which is one of the most popular and Open Source projects. Download the latest version of TinyMCE from download page, and extract the zip file.

Steps:

Create a new WebPage  in VS 2008.

Browse the extracted location and go to ..\tinymce_3.5.6\tinymce\jscripts folder.
Now copy the tinymce folder from the above location to your solution in Visual Studio.

Step 1:

Create a WebPage file named ContactUs.aspx.

Paste the code below into ContactUs.aspx:



<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Contact Us Form</title>
    <script type="text/javascript" src="tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
   tinyMCE.init({
        mode : "textareas",
        theme : "advanced",
        plugins : "safari,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,imagemanager,filemanager",
        theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect",
        theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
        theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
        theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,blockquote,pagebreak,|,insertfile,insertimage",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_statusbar_location : "bottom",
        theme_advanced_resizing : false,
        template_external_list_url : "js/template_list.js",
        external_link_list_url : "js/link_list.js",
        external_image_list_url : "js/image_list.js",
        media_external_list_url : "js/media_list.js"
    });
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
<table border = "0" style="width: 409px">
    <tr>
        <td>
            <asp:Label ID="Label1" runat="server" Text="Name*"></asp:Label><br />
        </td>
        <td>
            <asp:TextBox ID="txtName" runat="server" ValidationGroup = "contact"></asp:TextBox><br />
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="*"
             ControlToValidate = "txtName"></asp:RequiredFieldValidator>
        </td>
    </tr>
    <tr>
        <td>
            <asp:Label ID="Label2" runat="server" Text="Subject*"></asp:Label><br />
        </td>
        <td>
            <asp:TextBox ID="txtSubject" runat="server"></asp:TextBox><br />
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="*"
             ControlToValidate = "txtSubject"></asp:RequiredFieldValidator>
        </td>
    </tr>
    <tr>
        <td>
            <asp:Label ID="Label3" runat="server" Text="Email*"></asp:Label><br />
        </td>
        <td>
            <asp:TextBox ID="txtEmail" runat="server"></asp:TextBox><br />
            <asp:RegularExpressionValidator id="valRegEx" runat="server"
            ControlToValidate="txtEmail"
            ValidationExpression=".*@.*\..*"
            ErrorMessage="*Invalid Email address."
            display="dynamic">
            </asp:RegularExpressionValidator>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="*"
            ControlToValidate = "txtEmail"></asp:RequiredFieldValidator>
        </td>
    </tr>
    <tr>
        <td valign = "top" >
            <asp:Label ID="Label4" runat="server" Text="Body*"></asp:Label>
        </td>
        <td>
            <asp:TextBox ID="txtBody" runat="server" TextMode = "MultiLine" ></asp:TextBox><br />
            <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="*"
            ControlToValidate = "txtBody"></asp:RequiredFieldValidator>
        </td>
    </tr>
     <tr>
        <td></td>
        <td>
            <asp:FileUpload ID="FileUpload1" runat="server" />
       </td>
    </tr>
    <tr>
        <td></td>
        <td>
            <asp:Button ID="btnSend" runat="server" Text="Send" OnClick="btnSend_Click" />
       </td>
    </tr>
    <tr>
        <td></td>
        <td>
            <asp:Label ID="lblMessage" runat="server" Text="" ForeColor = "Green"></asp:Label>
       </td>
    </tr>
</table>
</div>
    </form>
</body>
</html>


Paste this code into ContactUs.aspx.cs:

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Net;
using System.Net.Mail;

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

    }
protected void btnSend_Click(object sender, EventArgs e)
{
    MailMessage mm = new MailMessage("sender@gmail.com", "receiver@gmail.com");
    mm.Subject = txtSubject.Text;
    mm.Body = "Name: " + txtName.Text + "<br /><br />Email: " + txtEmail.Text + "<br />" + txtBody.Text;
    if (FileUpload1.HasFile)
    {
        string FileName = System.IO.Path.GetFileName(FileUpload1.PostedFile.FileName)   ;
        mm.Attachments.Add(new Attachment(FileUpload1.PostedFile.InputStream, FileName));
    }
    mm.IsBodyHtml = true;
    SmtpClient smtp = new SmtpClient();
    smtp.Host = "smtp.gmail.com";
    smtp.EnableSsl = true;
    System.Net.NetworkCredential NetworkCred = new System.Net.NetworkCredential();
    NetworkCred.UserName = "sender@gmail.com";
    NetworkCred.Password = "xxxxx";
    smtp.UseDefaultCredentials = true;
    smtp.Credentials = NetworkCred;
    smtp.Port = 587;
    smtp.Send(mm);
    lblMessage.Text = "Email Sent SucessFully.";
}
}


Comments

Post a Comment

Popular posts from this blog

Retrieve Gmail Inbox into Asp.Net using Pop3.

I ntroduction : In this article I will explain how to integrate gmail mail into asp.net using pop3 server. Pop3 Commands: The commands used to retrieve mail from a Pop3 server by an email client are a series of text commands with single line responses from the mail server. The commands and examples used here are defined by   RFC 1939- Post Office Protocol- Version 3. user: User is the first command after the connection is established. To connect, all you have to do is supply your e-mail user id. Example Usage: USER  john.smith PASS: After having supplied your user name, the next command is to supply your e-mail password. Example Usage: PASS  **** STAT: Returns the number of emails in the mailbox and the number of bytes all the emails are taking on the server. Example Usage: STAT Sample Response:  +OK 3 345910   TOP : Takes  two arguments i.e., the sort number of the email on the server and the number of lines of text to...
Post a Comment
Read more

Insert, Edit, Update, Delete in Asp.Net Gridview

I ntroduction : In this article I will explain how to Insert, Edit, Update, Delete in Gridview in Asp.Net using C#. Description: First I will write code to Insert data into Gridview then I will perform Edit, Update and Delete operations on it. For achieving all these functionalities I have used following Gridview commands, they are: onrowediting onrowupdating onrowcancelingedit onPageIndexChanging Below is the code for aspx page: < html   xmlns ="http://www.w3.org/1999/xhtml"   > < head   id ="Head1"   runat ="server">      < title > Untitled Page </ title >      < style   type ="text/css"> .Gridview { font-family:Verdana; font-size:10pt; font-weight:normal; color:black; } </ style > < script   type ="text/javascript"> function  ConfirmationBox(username) { var  result = confirm( 'Are you sure you want to delete ' +user...
Post a Comment
Read more