AJAX-Enabled Web Poll System using LINQ to XML in ASP.NET with VB
Introduction
If you've ever seen or taken part in those polls on various websites which allow all users to cast their votes on a variety of subjects, then you know what this article is going to be about. Web polls can be a very good way of capturing a lot of data very easily. The data may not be 100% accurate, but seeing as they are so simple to take part in, they are likely to generate a lot of results.
In this article, we will be looking at how we can create a poll ourselves from scratch using Visual Studio.NET, and we can also implement a little AJAX in there to make the experience even quicker and easier for our visitors.
In this example, we are going to use an XML file to store the results of the poll and we will use an ASP.NET RadioButtonList control for the multiple-choice answer. The question we will be asking is, 'Who is your favorite Presidential Candidate?', which is a popular topic at the moment.
We will also provide an option to view the current results, complete with percentage of votes for each candidate.
We chose Server Intellect for its dedicated servers, for our web hosting. They have managed to handle virtually everything for us, from start to finish. And their customer service is stellar.
What we will learn in this article:
- How to use an external XML file to store data;
- How to retrieve data from an XML file and perform calculations.
Getting Started
To begin, let's start a new VB.net web application project in Visual Studio, and once opened, we can right-click on the project in Solution Explorer and then choose Add New Item.. XML File. Let's call it Poll.xml
[Click to enlarge]
We will use the following structure for the XML file, as we also want to capture the name of the voter:
We migrated our web sites to Server Intellect over one weekend and the setup was so smooth that we were up and running right away. They assisted us with everything we needed to do for all of our applications. With Server Intellect's help, we were able to avoid any headaches!
We add two sample votes to start the XML file off, and to keep it fair.
We are going to develop this as an AJAX Web Application, so let's go ahead and save the XML file and then move onto the ASPX page, where we will add a ScriptManager and an UpdatePanel:
We will be also adding a Literal control to display the current results of the poll, which we'll name litResults; a TextBox for the name of the voter, which we'll name txtName; a RadioButtonList for the poll options, which we'll name radVote; a button to submit the vote; butVote, a label to provide any errors or status messages; lblStatus, and finally another button to show the current results; butResults.
All of these controls will be placed in the ContentTemplate of the UpdatePanel, like so:
What is your name?
Who is your favorite Candidate?
Notice that we hide the Literal control by setting its Visible attribute to false, and then we can set it to true in the code-behind when we assign a value. We also add the choices of the RadioButtonList using the ListItem tags - we do not set a default value; the user must choose one.
We are almost done with building the ASPX page, but we want to code the event handlers for the buttons. We can do this by going into design view and either double-clicking the buttons to add an onclick event handler, or clicking the button once and then clicking the Events button (Lightning bolt) in the Properties Window and double-clicking on the Click event. This is a good way of accessing all the events of a control.
We moved our web sites to Server Intellect and have found them to be incredibly professional. Their setup is very easy and we were up and running in no time.
Go ahead and create event handlers in the code-behind for both buttons. We should have something like this:
End Sub
Protected Sub butResults_Click(ByVal sender As Object, ByVal e As EventArgs)
End Sub
We will create separate methods; one to read the XML file and retrieve the current results, and the other to submit the vote to the XML file. Then we will call these methods from the button click event handlers.
Let's start with the countVote method, which will add a new entry to the XML file. We will use a Try..Catch to avoid as many errors as we can. Using LINQ to XML, we can load the XML file and then very easily add a new element with the values passed through the form. Finally, we save the new XML document, let the visitor know their vote was successfuly cast and call the other method to output the current results:
xmlDoc.Element("Poll").Add(New XElement("Vote", New XElement("Name", txtName.Text), New XElement("Choice", theVote)))
xmlDoc.Save(Server.MapPath("Poll.xml"))
lblStatus.Text = "Thank you for your vote."
readXML()
Need help with Windows Dedicated Hosting? Try Server Intellect. I'm a happy customer!
The reading of the results is a little more complex than adding. We will use LINQ to XML to first load the XML file and then make a selection of all the dat, which we will then loop through to count the number of votes for each candidate. We will then use these figures to calculate the percentage of votes each candidate has received. Finally, we output the results to the Literal control:
Dim votes = From vote In xmlDoc.Descendants("Vote") _
Dim mCount As Integer = 0
Dim oCount As Integer = 0
For Each vote In votes
Dim theTotal As Double = mCount + oCount
Dim mPercent As Double = (mCount / theTotal) * 100
Dim oPercent As Double = (oCount / theTotal) * 100
litResults.Visible = True
litResults.Text = "Obama: " & oCount & " votes (" & oPercent & "%).
"
litResults.Text = litResults.Text & "McCain: " & mCount & " votes (" & mPercent & "%).
"
We can simply call this method from the button click event of the results button, like so:
We can also do the same for the vote button, but we will add a little validation to this one. We don't want the user to be able to vote without selecting an option or entering their name, so we use a simple IF statement:
I just signed up at Server Intellect and couldn't be more pleased with my Windows Server! Check it out and see for yourself.
Running this web application now will allow us to submit votes on the poll, and also view the current results:
What we have Learned
We have learned how to create a voting system using LINQ to XML and AJAX.
Attachments
|
|