Web-Based Surveys Made Easy, Part 2
By Steve Stchur
In Part 1 we looked at an overview of the Web survey control and the format of the survey XML file. In this second and final part we'll see a real-world example of using the survey control.
An Example Survey
To demonstrate the survey XML file, let's look at a complete, multi-page survey example. Before we look at the updated
survey.xml file, I took a moment to gussy up the ASP.NET Web page's HTML syntax, which
improves the appearance of the survey results. I used a bit of CSS and some tables for positioning.
<%@ Register TagPrefix = "sstchur" Namespace = "sstchur.web.survey" Assembly = "sstchur.web.survey" %>
|
The updated HTML contains some tables and CSS to pretty up the appearance a bit, but the most important thing to
notice is the C# additions made to the Page_Load event handler. I've added an if statement
which checks to see if the survey is "displayable" (the property PreviouslyCompleted is a Boolean value
which returns true if the survey can be displayed, and false otherwise). If the survey is "displayable" (i.e.
the user had not yet taken it), the <asp:Panel> whose id is phSurvey will be
made visible. If the survey is not "displayable", the <asp:Panel> with id
phPeviouslyCompleted is made visible.
While we've made some significant changes to the user interface, our survey is still rather devoid of content.
Let's add a intro page to the survey, a few more questions, and while we're at it, I'll introduce a few new tags.
Update the survey.xml file with the following XML markup:
<?xml version = "1.0"?>
|
While the survey file has grown quite a bit, don't feel overwhelmed, it's still pretty simple. The first thing to
notice is that I've added two new <Group> tags, giving us a total of three. This means that our
survey will span three pages. However, one thing you may find interesting is that the first <Group>
tag doesn't actually contain any questions, it only contains one simple <Separator> tag.
The <Separator> element is very powerful and is one of the features that allows for extreme
customization of the WebSuvey Control. You can place a <Separator> essentially anywhere in the
XML file, and within the <Separator>, you can place all kinds of HTML to help spice up your
survey. I haven't done anything earth-shattering in my example. Just a few short sentences explaining that
page one is an intro page, but it gives you an idea of what's possible.
The second <Group> tag has been altered a bit from our earlier example. First off, I added a
backimage attribute so that the user can return to the intro page if he desires. Secondly, I
changed the nextimage attribute to next.gif instead of finish.gif, since
this <Group> tag no longer represents the last page of the survey.
| Some of you might be wondering if you can use traditional buttons instead of image buttons. Unfortunately, the answer is no. It is something I am considering implementing, but for the time being, you'll need to create at least one GIF or JPEG image to represent your buttons. These images can reside anywhere, as long as you use a relative path to refer to them in the XML file. |
I've also added two new questions to this group. One asks for the user's last name, and the other requests his email address. Since both of these questions are short answer questions, which we've already covered, they don't require much explanation.
The third <Group> tag gets a little more interesting. Here was have a
<Question> of type mcss (multiple choice, single selection). It's fairly obvious,
but mcss questions have a predefined set of responses. Take a look at the Favorite Color question.
Each <Response> element within the <Responses> element represents one possible
answer. mcss questions are always displayed using radio buttons.
The next question, a mcms (multiple choice, multiple selection) question, functions in much the same
was as the mcss question, only users are allow to select multiple answers by using Ctrl + Click.
Questions of type mcms are displayed using a ListBox Control.
The last question is an essay question, and take two simple attributes, cols and rows,
which define the width and height of the TextArea. It's pretty self-explanatory. Essays questions offer the user
a TextArea in which to type long responses. They are a perfect choice for allow the user to provide additional
comments.
The screenshots below show the updated WebSurvey in action...
The answers.xml File
A survey isn't much good without any answers. When a user completes a survey, the results are stored in an XML-formatted
file as specified via the WebSurvey's AnswersFile property.
The file's structure is pretty simple. Every time someone completes the survey, you get a new
<AnswerSet> element appended to the file. Within each <AnswerSet> element
you will see various <Answer> tags. These are the tags that represent the answers to the
survey. Each <Answer> tag will have an questionId attribute with it, so you know which
question it refers to. A screenshot of the answers XML file is shown to the right.
At first glace, it might seem like this is a rather clumsy way to collect the answers to the survey. And I must admit myself, that if you have an extremely extensive survey with thousands of respondants, it is. However, the most important thing to keep in mind here, is that all of the data is kept in tact using this method. Therefore, a savvy programmer could quite easily write a script that extracts the data from the XML file and writes it to a database. Or, as I have often done myself, you could simply write a script that uses XQuery to directly query the data from the XML file. To see a quick and dirty example of what you can accomplish using XQuery, take a look at my Favorite Colors Poll.
Conclusion
This has been a rather whirlwind tour of the WebSurvey Control. We covered how to use the control in an ASP.NET Web page and how to create the
websurvey.xml file that goes with it.
If you have any questions or comments, or are having trouble implementing WebSurvey on your site, please don't hesitate
to drop me a line at sstchur@yahoo.com. I check my email pretty regularly,
so I should get back to you quickly.
That about wraps it up for this article. If you're wondering how I wrote this control, you'll have to wait till next time. Though I won't give you the source code outright, I will touch on the concepts I used to create this monster. And if you're so inclined, it should give you sufficient knowledge create a WebSurvey Control of your own. Additionally, a future article will look at working with the data in the Answers XML file in more detail.
Happy Programming!
Attachments:
