Create a Basic Quiz Engine for ASP.NET

This is a continuation of "Create a Basic Quiz Engine (part4)".

Here we will convert the WinForm version of the Basic Quiz Engine to an ASP.NET version.

The are some additions and subtractions that are necessary to convert a Winform project to ASP.NET.
The page state must be maintained between page loads. I will use the session object to accomplish this.

Example:

//Creating a session variable
Session["m_strCorrectAnswerDescription"] = strCorrectAnswerDescription;

//................................
//Using the contents of the session variable
strCorrectAnswerDescription = (string)Session["m_strCorrectAnswerDescription"];

 Layout is different with ASP.NET. Positioning of controls is accomplished by changing the "positioning" attribute to "absolute".

Example:

The look and layout of the various controls can be modified by changing their setting in the "Properties Panel" and CSS

Example:

Here is a sample layout for the 2 pages that is similar to the Winform application.

The ASP.NET GridView control is different that the Winform version and must be data bound to a data source. The requires some changes in the .aspx file and .cs file.

Example:

Create the SqlCommand in the questionPage.aspx file and layout the columns you with to appear in the gridView.

//Create the SqlCommand in the questionPage.aspx file <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:quiz1ConnectionString %>" SelectCommand="SELECT [UserID], [QuestionDescription], [UserAnswerDescription], [CorrectAnswerDescription], [UserQuestionScore] FROM [UserScore]"> </asp:SqlDataSource> //.................... //Layout and choose which columns get written to output <asp:GridView ID="dataGridView1" runat="server" style="z-index: 1; left: 250px; top: 150px; position: absolute; width: 656px" AutoGenerateColumns="False" DataSourceID="SqlDataSource2" BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" CellPadding="5" CellSpacing="2"> <columns> <asp:BoundField DataField="QuestionDescription" HeaderText="Question Description" SortExpression="QuestionDescription" > <itemstyle Width="200px" /> </asp:BoundField> <asp:BoundField DataField="UserAnswerDescription" HeaderText="User Answer" SortExpression="UserAnswerDescription" > <controlstyle Width="300px" /> <itemstyle Width="200px" /> </asp:BoundField> <asp:BoundField DataField="CorrectAnswerDescription" HeaderText="Correct Answer" SortExpression="CorrectAnswerDescription" > <controlstyle Width="200px" /> <itemstyle Width="200px" /> </asp:BoundField> <asp:BoundField DataField="UserQuestionScore" HeaderText="Score" SortExpression="UserQuestionScore" /> </Columns> <footerstyle BackColor="#F7DFB5" ForeColor="#8C4510" /> <headerstyle BackColor="#A55129" Font-Bold="True" ForeColor="White" /> <pagerstyle ForeColor="#8C4510" HorizontalAlign="Center" /> <rowstyle BackColor="#FFF7E7" ForeColor="#8C4510" /> <selectedrowstyle BackColor="#738A9C" Font-Bold="True" ForeColor="White" /> <sortedascendingcellstyle BackColor="#FFF1D4" /> <sortedascendingheaderstyle BackColor="#B95C30" /> <sorteddescendingcellstyle BackColor="#F1E5CE" /> <sorteddescendingheaderstyle BackColor="#93451F" /> </asp:GridView>

Read the UserScore Table usine the SqlDataSource2 to create a gridView in "questionPage.aspx.cs".

dataGridView1.DataBind();

Click here for the project code. Just create a SQL Server database with test data, edit the connection string and run it.