Introduction
Most Web masters, at one time or another, are asked to create an online survey for their company's web site. This
isn't a terribly difficult task with just plain HTML and traditional ASP, but suppose you'd like to be able to
create a survey quickly -- I mean really quickly -- and you don't want to be stuck with the same look and feel you
used last time. Rather, you want to create a survey with completely new questions and a fresh new look and feel.
Well, that might be a bit time consuming, depending on how much of your original code you're able to reuse.
Suppose there existed an easy-to-use component that could be added to an ASP.NET Web page using a simple declarative
syntax like <asp:Survey.../>, and POOF!, you've got a survey. Wouldn't that make life easier?
Well, that control exists. It's called WebSurvey, and it's an ASP.NET Server Control I created specifically for the
purpose of generating customizable web-based surveys quickly and easily.
To add such surveys to your Web site, all you need is copy of the assembly (the .dll file, available
at the end of this article) and some basic knowledge of XML. In this article I will show you how you can use WebSurvey
to quickly and easily add surveys to your Web site. In a future article I will examine the inner workings of the
WebSurvey control in more detail.
Using the WebSurvey Control
Generating a survey with the WebSurvey control is surprisingly easy. If you've ever worked with an ASP.NET Web page
before, and if you can create a little bit of well-formed XML, you should have the survey up and running in no time.
To begin, you'll need to create an ASP.NET page to house the WebSurvey Control.
The first thing to notice is the @Register directive that registers the control.
This directive tells the ASP.NET Web page that any declarative Web control syntax prefixed with sstchur
references a control defined in the sstchur.web.survey assembly and namespace. (The
sstchur.web.survey assembly contains the class for the WebSurvey control, and this assembly will need
to be added to your Web application's /bin directory.)
If you are using Visual Studio .NET, you can add the survey control to the Toolbox and then drag and drop it onto
an ASP.NET Web page's Designer. This will automatically add the @Register directive and the declarative
syntax in the ASP.NET Web page's HTML portion. You'll also need to add the assembly to the project's References folder.
(This has the effect of adding the file to the application's /bin directory.)
In the HTML portion you'll find the declarative syntax for the WebSurvey control, <sstchur:WebSurvey ... >.
Wherever you place this syntax is where the control will be rendered. You'll notice a few of the control's properties
have been assigned declaratively (you could also use the Properties pane in the Designer in VS.NET). The WebSurvey
control derives from System.Web.UI.WebControls.WebControl, meaning that it has all of the properties
that a standard ASP.NET Web control has, such as BackColor, Font, Height, Width,
and so on. In addition, WebSurvey has two other required properties:
SurveyFile - relative path to the XML file that contains the survey's questions.
AnswersFile - relative path to the XML file that will store the answers to the survey's questions. (This file need not exist initially).
Creating the survey.xml File
As it stands right now, the sample code we examined above won't run if the SurveyFile, survey.xml, has
not yet been created. If the WebSurvey control cannot find the specified SurveyFile, it will throw a
FileNotFoundException, as shown in the screenshot to the right. In order to remedy this problem, you need to create an XML-based file that contains the survey's questions. Let's see
how to do that now.
Begin by opening Notepad or the text editor of your choice. Create a new file named websurvey.xml that
contains the following XML:
<?xml version = "1.0"?>
<WebSurvey redirecturl = "websurvey.aspx" allowrepeats = "false" cookiename = "sstchur:Survey1">
<Group id = "grp_PersonalInfo" nextimage = "finish.gif">
<Question id = "Name" type = "shortans" cols = "40" required = "true">
<Statement>Please enter your first name:</Statement>
</Question>
</Group>
</WebSurvey>
With this sample survey file, we now have a working survey example. If you revisit the page, instead of receiving
a FileNotFoundException, you'll instead see a screen similar to the one shown to the left.
Granted, it's not terribly exciting at this point, but we'll take care of that a little later on.
For now, let's examine the tags in this XML file and the attributes that go along with them.
The <WebSurvey> tag is the XML document's root element and has three attributes, all of which
are required.
redirecturl -- The file to display once the survey has been completed. It could be the same
file (as in the example) or a completely different file.
allowrepeats -- When set to true, this attribute tells the WebSurvey to allow the same user to
complete the survey multiple times. Any other value is interpreted as false and will not allow repeats.
This is accomplished by checking for the existence of a cookie defined by the cookiename attribute.
cookiename -- The name of the cookie to be generated in the event that repeats are not allowed.
This can be any string, but I would recommend keeping the cookies names as unique as possible.
The <WebSurvey> element can consist of a number of <Group> elements, specifying
a set of questions on one particular page. That is, each <Group>...</Group> pair specifies
one page of questions in the survey. Note that every survey requires AT LEAST one <Group> tag.
Each <Group> element has three attributes.
id (required) -- A unique ID assigned to the <Group> tag. It can be any valid
string, but should be unique from any other <Group> tag's ID.
nextimage (required) -- Name of an image file (JPG or GIF) used as the "Next" or "Finish" button.
If you have only one page of questions, it acts as a Finish (or Submit) button. If you have multiple pages, it acts as a Next button for
all pages except the last page.
backimage -- This attribute is only applicable if you have multiple pages of questions in your
survey. Otherwise, it is meaningless and ignored. If you have multiple <Group> tags, this
attribute is required on all <Group> tags EXCEPT the first one.
Each <Group> element can consist of a variable number of <Question> elements.
Each <Question> element represents a question the user is asked.
The <Question> element has a variant number of attributes (depending on the type of question we're
dealing with). Here are some of the more germane attributes.
id -- A unique ID to represent this question. This can be essentially anything, but I would recommend something that describes
the question.
type -- Can be one of 4 types: mcss (multiple choice, single selection);
mcms (multiple choice, multiple selection);
shortans (short answer); or essay.
required -- true if the question if required. Any other value is interpreted as false.
rows -- Applicable only to questions of type essay. This attribute defines how many
rows (the height) of the Text Area.
cols -- Applicable to question of type shortans and essay. This
attributes defined how many columns (the width) of the TextBox.
Inside the <Question> element you'll find a <Statement> element. The
<Statement> element contains the text that is displayed for the question.
HTML markup is valid here, but keep in mind that we're dealing with XML so XML formatting rules apply - all
tags need to be closed (for example, <br> needs to be <br />) and properly nested,
and attribute values must be within quotation marks.
Now that we have examined the basics of the Web survey control and the syntax for the survey XML file, let's look at
an example of a more intricate survey example. We'll do this in Part 2.