How to write Contact Us Control

Problem

How to write a custom control that provides you the Email functionality for example a small contact us control using the CommerceBuilder classes.

Solution

This tutorial will guide you how to create a feedback or contact control for your AbleCommerce powered store. The main purpose is to utilize the AbleCommerce CommerceBuilder API for utilizing the AbleCommerce configured SMTP settings.

Let's start by first creating a ContactUs.ascx file in Website/ConLib/ folder. It would be better to construct this feedback form as a ConLib user control so that it can be used any where on the store side.

After creating the file now copy and paste the following code into the ContactUs.ascx file.

<%@ Control Language="C#" ClassName="ContactUs" %>

<script runat="server">
    
    private string _sendTo;
    
    public string SendTo 
    {
        get { return _sendTo; }
        set { _sendTo = value; }
    }

    protected void SendButton_Click(object sender, EventArgs e)
    {
        Store store = Token.Instance.Store;
        StoreSettingCollection settings = store.Settings;
        System.Net.Mail.MailMessage mailMessage = new System.Net.Mail.MailMessage();
        
        if (String.IsNullOrEmpty(SendTo))
            mailMessage.To.Add(settings.DefaultEmailAddress);
        else
            mailMessage.To.Add(SendTo);
        mailMessage.From = new System.Net.Mail.MailAddress(Email.Text);
        mailMessage.Subject = "Feedback";
        mailMessage.Body += "Name: "+Name.Text+Environment.NewLine;
        mailMessage.Body += "Email: " + Email.Text + Environment.NewLine;
        mailMessage.Body += "Comment: "+Environment.NewLine+Comment.Text;
        mailMessage.BodyEncoding = System.Text.Encoding.UTF8;
        mailMessage.IsBodyHtml = false;
        mailMessage.Priority = System.Net.Mail.MailPriority.High;
        SmtpSettings smtpSettings = SmtpSettings.DefaultSettings;
        
        try
        {
            MessageLabel.Text = "Message Sent";
            MessageLabel.CssClass = "goodCondition";
            EmailClient.Send(mailMessage);
        }
        catch (Exception exp)
        {
            MessageLabel.Text = exp.Message;
            MessageLabel.CssClass = "errorCondition";
        }

    }
</script>

<table cellpadding="0" cellspacing="0" class="inputForm">
    <tr>
        <th style="text-align:right;padding-right:3px;">
            Name</th>
        <td>
            <asp:TextBox ID="Name" runat="server" ValidationGroup="ContactUs"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="Name"
                        ErrorMessage="Name is Required." ToolTip="Email Address is Required." 
                        Display="Static" Text="*" ValidationGroup="ContactUs">*</asp:RequiredFieldValidator>
            </td>
    </tr>
    <tr>
        <th style="text-align:right;padding-right:3px;">
            Email</th>
        <td>
            <asp:TextBox ID="Email" runat="server" ValidationGroup="ContactUs"></asp:TextBox>
            <asp:RequiredFieldValidator ID="EmailRequired" runat="server" ControlToValidate="Email"
                        ErrorMessage="Email Address is Required." ToolTip="Email Address is Required." 
                        Display="Static" Text="*" ValidationGroup="ContactUs">*</asp:RequiredFieldValidator>
                    <asp:RegularExpressionValidator ID="EmailValidator" runat="server" Display="Static" 
                        ControlToValidate="Email" ValidationExpression="\S+@\S+\.\S+" ErrorMessage="The email address is not properly formatted." 
                        Text="*" ValidationGroup="ContactUs"></asp:RegularExpressionValidator>
            </td>
    </tr>
    <tr>
        <th style="text-align:right;padding-right:3px;">
            Comment</th>
        <td>
            <asp:TextBox ID="Comment" runat="server" TextMode="MultiLine" ValidationGroup="ContactUs"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="Comment"
                        ErrorMessage="Comment is Required." ToolTip="Email Address is Required." 
                        Display="Static" Text="*" ValidationGroup="ContactUs">*</asp:RequiredFieldValidator>
            </td>
    </tr>
    <tr>
        <td>
        </td>
        <td>
            <asp:Button ID="SendButton" runat="server" Text="Send" ValidationGroup="ContactUs" OnClick="SendButton_Click" /></td>
    </tr>
    <tr>
        <td></td>
        <td >
        <asp:Label ID="MessageLabel" runat="server"></asp:Label>
            <asp:ValidationSummary ID="ContactUsSummary" runat="server" ValidationGroup="ContactUs" />
        </td>
    </tr>
</table>

Now contact us control is available and you can use it just like any other conlib control across the store.

[[ConLib:ContactUs SendTo="info@yourstore.com"]]

SendTo Property

The control exposes a SendTo property. You can use this property to specify the address at which you want to receive the Email. For example you want to recieve the Email at your Email address dedicated for customer feedback then the use of control will be as bellow.

[[ConLib:ContactUs SendTo="feedback@yourdomain.com"]]

Also keep in mind that if you don't provide any SendTo Email address then the control will be used the default Email address defined in the SMTP settings for stor