How to Create Comment System in Asp.Net With XML Database

In this blog we will learn about Create Comment System in Asp.net With XML Database.

The comment system is very important nowadays. Everyone to hear from their user about their work. Comment system allows users to give their feedback.

In this blog, we are going to create a comment system using VB.net and XML Database. So let’s start to design comment system.


Figure1:

HTML Code

<div id="CommentForm">
    <table>
        <tr>
            <td valign="top" >
                <br />
                <br />
            </td>
            <td>
Your Name :
                <br />
                <asp:TextBox ID="author" runat="server" Width="350" CssClass="CommentInputBox" />
                <br />
Email :

                <div class="DivDate">
(Not be displayed)
</div>
                <asp:TextBox ID="email" runat="server" Width="350" CssClass="CommentInputBox" />
                <br />
                <asp:RegularExpressionValidator ID="eRev" runat="server" ControlToValidate="email"
Display="Dynamic" ErrorMessage="Not a valid email address." SetFocusOnError="True"
ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" CssClass="CommentInputBox"
ValidationGroup="comment"></asp:RegularExpressionValidator>
Message :
                <br />
                <asp:TextBox ID="comment" runat="server" Width="350" CssClass="CommentInputBox" TextMode="MultiLine"
Rows="2" Height="96px" />
                <br />
                <div id="CaptchaLabel">
                    <asp:Image ID="lblResult" runat="server" ImageUrl="GetImage.aspx" Image
AlternateText="" />
                </div>
                <div id="CaptchaVerify">
Verification Number
                    <br />
                    <asp:TextBox ID="txtCaptcha" runat="server" Width="120" CssClass="CommentInputBox" />
                    <br />
                    <br />
                    <br />
                    <asp:Button ID="Button1" runat="server" Text="Submit Comment" OnClick="UploadComment"
CssClass="CommentButton" ValidationGroup="comment" />
                </div>
            </td>
        </tr>
    </table>
</div>

We use Verification system to avoid robot comment and spam filter.

Private Function GenerateRandomCode() As String
'Generate a random number for the CAPTCHA image
Dim s As String = ""
For i As Integer = 0 To 5
ss = s + Me.rand.Next(10).ToString()
Next
Return s
End Function

Bind the XML file to display previous comment on the aspx page.

Public Sub LoadData()
'Load the data from the XML file into the DataList
Dim ds As DataSet = New DataSet
Dim dt As DataTable
dt = New DataTable("Comment")
dt.Columns.Add("CommentText", System.Type.GetType("System.String"))
dt.Columns.Add("Author", System.Type.GetType("System.String"))
dt.Columns.Add("Email", System.Type.GetType("System.String"))
dt.Columns.Add("DateStamp", System.Type.GetType("System.DateTime"))
dt.ReadXml(Server.MapPath("xml\2.xml"))
Dim Sort_Column_Key As String = "DateStamp"
Dim Sort_Direction As String = " DESC"
Dim Sort_Format As String = "{0} {1}"
dt.DefaultView.Sort = String.Format(Sort_Format, Sort_Column_Key, Sort_Direction)
ds.Tables.Add(dt.DefaultView.ToTable())
DataList1.DataSource = ds
DataList1.DataBind()
'
set captcha image
SetCaptcha()
End Sub

Add JavaScript Event to the fields for slick validation

author.Attributes.Add("onClick", "if(this.value=='-- enter your name --'){this.value='';this.className='CommentInputBox';}")

email.Attributes.Add("onClick", "if(this.value=='-- enter your email --'){this.value='';this.className='CommentInputBox';}")

comment.Attributes.Add("onClick", "if(this.value=='-- enter a comment --'){this.value='';this.className='CommentInputBox';}")

txtCaptcha.Attributes.Add("onClick", "if(this.value=='-- wrong code --'){this.value='';this.className='CommentInputBox';}")

On user, click checks the validation to add the comment in the XML file. I’m going to use UpdatePanel to display loading process on the use side. So let’s add some code for that.

Checking the validation of textbox and Captcha code to avoid the spam comment.

'validate text boxes
If Len(author.Text) = 0 Or author.Text = "-- enter your name --" Then
author.CssClass = "CommentInputBoxRed"
author.Text = "-- enter your name --"
doUpload = False
End If

If Len(comment.Text) = 0 Or comment.Text = "-- enter a comment --" Then
comment.CssClass = "CommentInputBoxRed"
comment.Text = "-- enter a comment --"
doUpload = False
End If


If Len(email.Text) = 0 Or email.Text = "-- enter a email --" Then
email.CssClass = "CommentInputBoxRed"
email.Text = "-- enter a email --"
doUpload = False
End If

Checking the captcha code

Dim tempString As String = Me.Session("CaptchaImageText")
If String.Compare(tempString, Me.txtCaptcha.Text.Trim()) = 0 Then

'Code Functionality Here.
Else
txtCaptcha.CssClass = "CommentInputBoxRed"
txtCaptcha.Text = "-- wrong code --"
SetCaptcha()
doUpload = False
End If

If there are no validation error and captcha image code are correct then allow use submit their comment on the page. We are going to insert the comment in XML file.

'write the text to the XML file
If doUpload Then
Dim myxml As System.Xml.XmlDocument = New System.Xml.XmlDocument()
myxml.Load(Server.MapPath("xml/2.xml"))

Dim myxmlrecord As System.Xml.XmlElement = myxml.CreateElement("Comment")
Dim myxmlfield As System.Xml.XmlElement
Dim TodayDate As Date = Now

myxmlfield = myxml.CreateElement("CommentText")
myxmlfield.InnerText = XmlEncode(comment.Text)
myxmlrecord.AppendChild(myxmlfield)

myxmlfield = myxml.CreateElement("Author")
myxmlfield.InnerText = XmlEncode(author.Text)
myxmlrecord.AppendChild(myxmlfield)

myxmlfield = myxml.CreateElement("Email")
myxmlfield.InnerText = XmlEncode(email.Text)
myxmlrecord.AppendChild(myxmlfield)

myxmlfield = myxml.CreateElement("DateStamp")
myxmlfield.InnerText = DateTime.Now.ToString("yyyy-MM-ddTHH:mm:ss.fffffff")
myxmlrecord.AppendChild(myxmlfield)

myxml.ChildNodes(1).AppendChild(myxmlrecord)
myxml.Save(Server.MapPath("xml/2.xml"))

On success lets clear the textbox values and again load the data from XML database

author.Text = ""
email.Text = ""
comment.Text = ""
txtCaptcha.Text = ""

LoadData();

Let’s set the captcha image again for a new comment. We have created a function in the above code so don’t have to write the same code again. Only we have to call the function here.

SetCaptcha();

Result of Comment System


Figure 2:

I hope you enjoyed from the comment system development in asp.net using vb.net with XML database.

Thanks