When you think ASP, think...
Recent Articles
All Articles
ASP.NET Articles
ASPFAQs.com
Message Board
Related Web Technologies
User Tips!
Coding Tips
Search

Sections:
Book Reviews
Sample Chapters
Commonly Asked Message Board Questions
JavaScript Tutorials
MSDN Communities Hub
Official Docs
Security
Stump the SQL Guru!
Web Hosts
XML
Information:
Advertise
Feedback
Author an Article
Jobs

ASP ASP.NET ASP FAQs Message Board Feedback ASP Jobs
 
Print this Page!
Published: Wednesday, November 10, 2004

Working with the WebSurvey Control's Results

By Steve Stchur


Introduction


A few months back, I wrote an article for 4Guys called Web-based Surveys Made Easy. In it, I introduced the WebSurvey control, a compiled ASP.NET server control I had written to allow Web developers to quickly and easily create Web-based surveys. In general, the responses I received from that article were very favorable, and I'd like to thank everyone who took the time to write to me with questions, comments or suggestions. A few of the ideas suggested to me have already been implemented, and many more are being considered. If you haven't already done so, you might wish to download the latest version of the DLL from my WebSurvey Control Web site.

In this article, I want to introduce another control, SurveyResult, which is designed to work hand-in-hand with WebSurvey. As it's name implies, SurveyResult displays the results of a WebSurvey survey. In my previous article we looked at how to use the WebSurvey control; by the end of this article you'll see how to easily display the results of a completed survey. Read on to learn more! (If you've not yet read my previous article, Web-based Surveys Made Easy, I highly encourage you to do so before continuing on with this piece.)

- continued -

Using the SurveyResult Control


Using the SurveyResult control is, syntactically, very similar to using the WebSurvey Control. Here is an example of the tag syntax, with an explanation of the attributes to follow: (Note: The sstchur prefix assumes you've included a <%@ Register TagPrefix = "sstchur" ... %> directive in your ASP.NET page.)

<sstchur:SurveyResult id = "srMySurvey"
     SurveyFile = "mysurvey.xml"
     AnswersFile = "answers.xml"
     Stylesheet = "stylesheet.xsl"
     XQuery1 = "//WebSurvey/Group/Question"
     XQuery2 = "//Answers/AnswerSet/Answer"
     runat = "server" />

SurveyResult derives from the WebControl class in the System.Web.UI.WebControls namespace, so all of the public properties available to the WebControl class are also available to the SurveyResult control, such as Visible, Font, ForeColor, BackColor, CssClass, etc., etc.

In the above example, the attributes listed are all required (with the exception of ID). Here is a brief explanation of each of these required attributes:

  • SurveyFile - the relative path to the XML-based file that contains the data (questions) for your survey. As we saw in Web-based Surveys Made Easy, a survey's questions are spelled out in a correctly-formatted XML file.
  • AnswersFile - the relative path to the XML-based file that contains the answers to your survey (recall that this answers XML file is auto-generated by WebSurvey).
  • Stylesheet - the relative path to the XSL stylesheet that defines how the results of the survey should be displayed in HTML.
  • XQuery1 - the XPath expression to be executed against the SurveyFile.
  • XQuery2 - the XPath expression to be executed against the AnswersFile.
The first two attributes are pretty self-explanatory. The SurveyFile is the XML file you've created, defining the survey's questions. The AnswersFile is generated/appended whenever someone completes the survey. The Stylesheet must be manually created and can be a bit complex, but I have at least one stock stylesheet available at the end of this article that will get most people on the right track.

The XQuery attributes are where things can get a bit tricky. In order to form a proper query, you need to understand at least the basics of XQuery. If you're not familiar with it, I'd highly recommend reading the W3Schools Tutorial on XQuery, and Scott Mitchell's article, Querying XML Data with XQuery.

A Basic SurveyResult Stylesheet


XSL stand for eXtensible Stylesheet Language, and is one of the means by which an XML document can be transformed into meaningful HTML for display in a Web browser. Since the results of the WebSurvey are stored in XML, and we'd like to display the results in a Web browser, XSL is an ideal choice for converting the raw XML data into appropriate HTML markup. As with XQuery, you'll need to understand the basics of XSL in order to create a useful stylesheet for the SurveyResult control. Once again, I'd recommend reading the W3Schools Tutorial on XSLT (XSL Transformations). XSLT can get extremely complex, and the W3Schools Tutorial covers the basics far better than I could.

One of the most common uses of the WebSurvey control is to conduct polls or gather customer opinions. Generally, such surveys consist primarily of MCSS (multiple choice, single selection) type questions, so I've create a stock-stylesheet specifically for gathering the results of such a survey. This stylesheet can be used with little (or no) modification and provides a fairly nice-looking display for your results. This stock stylesheet is available for download at the end of this article.

I'll explain the inner-workings of the stylesheet later in this article, but first I'd like to create a working example so that you can see exactly how easy it is to generate WebSurvey results with the WebSurvey control and how to view them with the SurveyResult control. For this example, you'll need to download these samples files I created, which are also available at the end of this article. The first step is to create the page that displays the survey and its questions:

<%@ Register TagPrefix = "sstchur" Namespace = "sstchur.web.survey" Assembly = "sstchur.web.survey" %>
<%@ Page Language = "C#" Debug = "true"%>

<html>
  <head>
    <style type = "text/css">
      body, table, td
      {
        font-family: arial;
        font-size: 12px;
        color: #336699;
      }
    </style>
  </head>

  <body bgcolor = "#ffffff">

    <table border = 0 cellpadding = 0 cellspacing = 0 width = 100% height = 100%>
      <tr valign = "top" align = "center">
        <td width = 100% height = 100%>

          <table border = 0 cellpadding = 10 cellspacing = 0 width = 500 style = "border: solid 1px #000000;">
            <tr valign = "top" align = "left">
              <td>
                        <center>
                           <h2>WebSurvey Demo</h2>
                        </center>
                          
                        <form runat = "server">
                           <sstchur:WebSurvey id = "ws"
                              SurveyFile = "surveySample.xml"
                              AnswersFile = "answersSample.xml"
                              runat = "server"/>

                        </form>
              </td>
            </tr>
          </table>

        </td>
      </tr>
    </table>
  </body>
</html>

I've added some CSS and a <table> for positioning purposes, but the main thing to note is the SurveyResult Web control. If you're unfamiliar with how to use the WebSurvey control, please read my previous 4Guys article, Web-based Surveys Made Easy. You'll notice that there is no programming logic in this page. This is because the surveySample.xml file contains a redirecturl = "thankyou.aspx" attribute, which causes the user to be send to thankyou.aspx upon completion of the survey.

Once you have created the page to display the survey and its questions, the remaining step is to create the page that will show the survey's results. This second page uses the SurveyResult control, as shown below:

<%@ Register TagPrefix = "sstchur" Namespace = "sstchur.web.survey" Assembly = "sstchur.web.survey" %>
<%@ Page Language = "C#" Debug = "true"%>

<html>
  <head>    
    <style type = "text/css">
      body, table, td
      {
        font-family: arial;
        font-size: 12px;
        color: #336699;
      }
    </style>
  </head>

  <body bgcolor = "#ffffff">

    <table border = 0 cellpadding = 0 cellspacing = 0 width = 100% height = 100%>
      <tr valign = "top" align = "center">
        <td width = 100% height = 100%>

          <table border = 0 cellpadding = 10 cellspacing = 0 width = 500 style = "border: solid 1px #000000;">
            <tr valign = "top" align = "left">
              <td>
                        <center>
                           <h2>WebSurvey Demo - Survey Results</h2>
                        </center>

                        <p>Thank you for completing our survey.</p>

                        <p>The results of the survey (as generated by the SurveyResult Control) can be seen below.</p>

                        <form runat = "server">

                           <sstchur:SurveyResult id = "srMySurvey"
                                 SurveyFile = "surveySample.xml"
                                 AnswersFile = "answersSample.xml"
                                 Stylesheet = "stylesheet.xsl"
                                 XQuery1 = "//WebSurvey/Group/Question"
                                 XQuery2 = "//Answers/AnswerSet/Answer"
                                 runat = "server"/>
                        </form>

                        <p>Click <a href = "index.aspx">here</a> to return to the WebSurvey demo.</p>

              </td>
            </tr>
          </table>

        </td>
      </tr>
    </table>
  </body>
</html>

You'll notice that this file is strikingly similar to the previous one. This is due mostly to the fact that I'm lazy, but also because there really isn't a whole lot you need to do to get the SurveyResult control working. It really is that easy! Again, there is no programming logic in this page because the SurveyResult control takes care of everything for us. I simply provide an HTML link back to the survey in case the user wants to take it again.

To put the whole thing together, save the above two pages, and place them in a folder along with surveySample.xml, answersSample.xml, and stylesheet.xsl. (You'll also need finish.gif if you want to see the finish button on the survey.) Once you've got all of these files together in one directory, double-check to make sure the ASPNET account has proper permissions to read and write files in said directory. Then browse to the WebSurvey file and, if all goes well, you should see the sample survey. Complete the survey and you should be redirected to the results page, thankyou.aspx. The screen shots below show the example in action.

Now that you've seen the basics of the SurveyResult control, let's take a more in-depth look at the XSL stylesheet used to format the results. We'll do this in Part 2.

  • Read Part 2!



  • ASP.NET [1.x] [2.0] | ASPMessageboard.com | ASPFAQs.com | Advertise | Feedback | Author an Article