0

我是一名新的 ASP.NET 开发人员,我正在尝试开发一个简单的测验引擎,它允许系统管理员使用两个 ListViews 创建测验。第一个 ListView 用于插入测验标题和描述,第二个 ListView 用于插入问题、答案(不同数量的答案)、正确答案、答案说明、问题顺序。

我有以下数据库设计:

Quiz Table: QuizID, Title, Description
Question Table: QuestionID, Question, QuestionOrder, AnswerExplanation
QuestionImage Table: ID, QuestionID, URL
Answer Table: AnswerID, Answer
QuizContent Table: ID, QuizID, QuestionID, AnswerID

我让我对将第二个 ListView 与数据绑定感到困惑的要求:

  1. 每个测验都有不同数量的问题,每个问题都有不同数量的可能答案。例如,在其中一个测验中,我有两个问题。在第一个问题中,我有四个可能的答案,第二个问题将是 True or False 问题。
  2. 有些问题可能有一些图像。

这个 ListView 应该支持 CRUDE 操作。那么该怎么做呢?

我的第一个 ListView 的 ASP.NET 代码:

<asp:ListView ID="ListView1" runat="server" DataKeyNames="QuizID" 
                DataSourceID="SqlDataSource1" InsertItemPosition="LastItem" >

                <EditItemTemplate>
                    <tr style="">
                        <td>
                            <asp:ImageButton ID="UpdateButton" ImageUrl="Images/icons/update24.png" Width="20px" runat="server" CommandName="Update" />

                            <asp:ImageButton ID="CancelButton" ImageUrl="Images/icons/cancel324.png" Width="20px" runat="server" CommandName="Cancel" />
                        </td>
                        <td>
                            <asp:TextBox ID="TitleTextBox" runat="server" Text='<%# Bind("Title") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="DescriptionTextBox" runat="server" 
                                Text='<%# Bind("Description") %>' />
                        </td>
                    </tr>
                </EditItemTemplate>
                <EmptyDataTemplate>
                    <table id="Table1" runat="server" style="">
                        <tr>
                            <td>
                                No data was returned.</td>
                        </tr>
                    </table>
                </EmptyDataTemplate>
                <InsertItemTemplate>
                    <tr style="">
                        <td>
                            <asp:ImageButton ID="InsertButton" ImageUrl="Images/icons/create 2 48.png" Width="20px" runat="server" CommandName="Insert" />

                            <asp:ImageButton ID="CancelButton" ImageUrl="images/clear3.png" Width="20px" runat="server" CommandName="Cancel" />
                        </td>

                        <%--<td>
                            &nbsp;</td>--%>
                        <td>
                            <asp:TextBox ID="TitleTextBox" runat="server" Text='<%# Bind("Title") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="DescriptionTextBox" runat="server" 
                                Text='<%# Bind("Description") %>' />
                        </td>
                    </tr>
                </InsertItemTemplate>
                <ItemTemplate>
                    <tr style="">
                        <td>
                            <asp:ImageButton ID="DeleteButton" ImageUrl="Images/icons/delete24.png" Width="20px" runat="server" CommandName="Delete" />

                            <asp:ImageButton ID="EditButton" ImageUrl="Images/icons/edit224.png" Width="20px" runat="server" CommandName="Edit" />

                            <asp:ImageButton ID="SelectButton" ImageUrl="images/select.png" Width="20px" runat="server" CommandName="Select" />
                            <%--<asp:Button ID="SelectButton" runat="server" CommandName="Select" Text="Select" />--%>
                        </td>
                        <%--<td>
                            <asp:Label ID="QuizIDLabel" runat="server" 
                                Text='<%# Eval("QuizID") %>' />
                        </td>--%>
                        <td>
                            <asp:Label ID="TitleLabel" runat="server" Text='<%# Eval("Title") %>' />
                        </td>
                        <td>
                            <asp:Label ID="DescriptionLabel" runat="server" 
                                Text='<%# Eval("Description") %>' />
                        </td>
                    </tr>
                </ItemTemplate>
                <LayoutTemplate>
                    <div ><table id="thetable" width="97%" cellpadding="0px" cellspacing="0px" style="margin:0px 0px 0px 0px; border:2px solid #003366; font-size:13px; font-weight:bold;">
                        <thead>
                            <tr style="background-color:#C6D7B5;">
                                <th style="border-bottom:2px solid #003366; ">...</th>
                                <th style="border-bottom:2px solid #003366; ">Title</th>
                                <th style="border-bottom:2px solid #003366; ">Description</th>
                            </tr>
                       </thead>
                       <tbody><tr id="itemPlaceholder" runat="server"></tr></tbody>
                    </table></div>
                </LayoutTemplate>
                <SelectedItemTemplate>
                    <tr style="">
                        <td>
                            <asp:ImageButton ID="DeleteButton" ImageUrl="images/delete24.png" Width="20px" runat="server" CommandName="Delete" />

                            <asp:ImageButton ID="EditButton" ImageUrl="images/edit224.png" Width="20px" runat="server" CommandName="Edit" />
                        </td>
                        <%--<td>
                            <asp:Label ID="QuizIDLabel" runat="server" 
                                Text='<%# Eval("QuizID") %>' />
                        </td>--%>
                        <td>
                            <asp:Label ID="TitleLabel" runat="server" Text='<%# Eval("Title") %>' />
                        </td>
                        <td>
                            <asp:Label ID="DescriptionLabel" runat="server" 
                                Text='<%# Eval("Description") %>' />
                        </td>
                    </tr>
                </SelectedItemTemplate>
            </asp:ListView>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
                ConnectionString="<%$ ConnectionStrings:QuizSysDBConnectionString %>" 

                SelectCommand="SELECT * FROM [Quiz]" 
                DeleteCommand="DELETE FROM [Quiz] WHERE [QuizID] = @QuizID" 
                InsertCommand="INSERT INTO [Quiz] ([Title], [Description]) VALUES (@Title, @Description)" 


                UpdateCommand="UPDATE [Quiz] SET [Title] = @Title, [Description] = @Description WHERE [QuizID] = @QuizID">
                <DeleteParameters>
                    <asp:Parameter Name="QuizID" Type="Int32" />
                </DeleteParameters>
                <InsertParameters>
                    <asp:Parameter Name="Title" Type="String" />
                    <asp:Parameter Name="Description" Type="String" />
                </InsertParameters>
                <UpdateParameters>
                    <asp:Parameter Name="Title" Type="String" />
                    <asp:Parameter Name="Description" Type="String" />
                    <asp:Parameter Name="QuizID" Type="Int32" />
                </UpdateParameters>
            </asp:SqlDataSource>

我的第二个 ListView 代码:

<div align="center">
        <asp:ListView ID="ListView2" runat="server" DataSourceID="SqlDataSource2" 
            DataKeyNames="QuestionID" InsertItemPosition="LastItem">

            <EditItemTemplate>

                <tr style="background-color: #FFCC66;color: #000080;">
                    <td>
                        <asp:ImageButton ID="UpdateButton" ImageUrl="Images/icons/update24.png" Width="20px" runat="server" CommandName="Update" />

                        <asp:ImageButton ID="CancelButton" ImageUrl="Images/icons/cancel324.png" Width="20px" runat="server" CommandName="Cancel" />
                    </td>
                    <%--<td>
                        <asp:Label ID="QuestionIDLabel1" runat="server" 
                            Text='<%# Eval("QuestionID") %>' />
                    </td>--%>
                    <td>
                        <asp:TextBox ID="QuestionTextBox" runat="server" Text='<%# Bind("Question") %>' CssClass="textbox" />
                    </td>
                    <td>
                        <asp:TextBox ID="Answer1TextBox" runat="server" Text='<%# Bind("Answer") %>' CssClass="textbox" />
                    </td>
                    <td>
                        <asp:TextBox ID="CorrectAnswerTextBox" runat="server" 
                            Text='<%# Bind("CorrectAnswer") %>' CssClass="textbox" />
                    </td>
                    <td>
                        <asp:TextBox ID="AnswerExplanationTextBox" runat="server" 
                            Text='<%# Bind("AnswerExplanation") %>' CssClass="textbox" />
                    </td>
                    <td>
                        <asp:TextBox ID="QuestionOrderTextBox" runat="server" 
                            Text='<%# Bind("QuestionOrder") %>' CssClass="textbox" />
                    </td>
                </tr>
            </EditItemTemplate>

            <EmptyDataTemplate>
                <table id="Table2" runat="server" 
                    style="background-color: #FFFFFF;border-collapse: collapse;border-color: #999999;border-style:none;border-width:1px;">
                    <tr>
                        <td>
                            No data was returned.</td>
                    </tr>
                </table>
            </EmptyDataTemplate>

            <InsertItemTemplate>
                <tr style="">
                    <td>
                        <asp:ImageButton ID="ImageButton1" ImageUrl="images/insert.png" Width="20px" runat="server" CommandName="Insert" />

                        <asp:ImageButton ID="CancelButton" ImageUrl="images/clear3.png" Width="20px" runat="server" CommandName="Cancel" />
                    </td>
                    <%--<td>
                        &nbsp;</td>--%>
                    <td>
                        <asp:TextBox ID="QuestionTextBox" runat="server" Text='<%# Bind("Question") %>' CssClass="textbox" />
                    </td>
                    <td>
                        <asp:TextBox ID="AnswerTextBox" runat="server" Text='<%# Bind("Answer1") %>' CssClass="textbox" />
                    </td>
                    <td>
                        <%-- to hide the bollon when mouse out, just add onmouseout="BalloonPopupControlBehavior.hidePopup();  --%>
                        <asp:TextBox ID="CorrectAnswerTextBox" runat="server" Text='<%# Bind("CorrectAnswer") %>' CssClass="textbox"/>
                    </td>
                    <td>
                        <asp:TextBox ID="AnswerExplanationTextBox" runat="server" Text='<%# Bind("AnswerExplanation") %>' CssClass="textbox" />
                    </td>
                    <td>
                        <asp:TextBox ID="QuestionOrderTextBox" runat="server" Text='<%# Bind("QuestionOrder") %>' CssClass="textbox" />
                    </td>
                </tr>

                <%-- --%>
                <ajaxtoolkit:balloonpopupextender ID="BalloonPopupExtender1" runat="server"
                                            TargetControlID="CorrectAnswerTextBox" BalloonPopupControlID="pnlBallon"
                                            Position="BottomRight" BalloonStyle="Cloud" BalloonSize="Small" 
                                            CustomCssUrl="ballonPopupStyle" 
                    CustomClassName="oval" UseShadow="true" ScrollBars="Auto" 
                                            DisplayOnMouseOver="false" DisplayOnFocus="true" 
                    DisplayOnClick="true" >
                </ajaxToolkit:BalloonPopupExtender>

                <asp:Panel ID="pnlBallon" runat="server">
                    Please enter the letter of the correct answer A, B, C, D.
                </asp:Panel>

            </InsertItemTemplate>

            <ItemTemplate>
                <tr style="background-color: #FFFBD6;color: #333333;">
                    <td>
                        <asp:ImageButton ID="DeleteButton" ImageUrl="Images/icons/delete24.png" Width="20px" runat="server" CommandName="Delete" />

                            <asp:ImageButton ID="EditButton" ImageUrl="Images/icons/edit224.png" Width="20px" runat="server" CommandName="Edit" />
                    </td>
                    <td>
                        <asp:Label ID="QuestionLabel" runat="server" Text='<%# Eval("Question") %>' />
                    </td>
                    <td>
                        <asp:Label ID="Answer1Label" runat="server" Text='<%# Eval("Answer") %>' />
                    </td>
                    <td>
                        <asp:Label ID="CorrectAnswerLabel" runat="server" 
                            Text='<%# Eval("CorrectAnswer") %>' />
                    </td>
                    <td>
                        <asp:Label ID="AnswerExplanationLabel" runat="server" 
                            Text='<%# Eval("AnswerExplanation") %>' />
                    </td>
                    <td>
                        <asp:Label ID="QuestionOrderLabel" runat="server" 
                            Text='<%# Eval("QuestionOrder") %>' />
                    </td>
                </tr>
            </ItemTemplate>

            <LayoutTemplate>
                <div><table id="thetable" width="97%" cellpadding="0px" cellspacing="0px" style="margin:0px 0px 0px 0px; border:2px solid #003366; font-size:13px; font-weight:bold;">
                        <thead>
                            <tr style="background-color:#C6D7B5;">
                                <th style="border-bottom:2px solid #003366; ">...</th>
                                <th style="border-bottom:2px solid #003366; ">Question</th>
                                <th style="border-bottom:2px solid #003366; ">Answer</th>
                                <th style="border-bottom:2px solid #003366; ">Correct Answer</th>
                                <th style="border-bottom:2px solid #003366; ">Answer Explanation</th>
                                <th style="border-bottom:2px solid #003366; ">Question Order</th>
                                <th style="border-bottom:2px solid #003366; ">Image</th>
                            </tr>
                       </thead>
                       <tbody><tr id="itemPlaceholder" runat="server"></tr></tbody>
                </table></div>

            </LayoutTemplate>
            <SelectedItemTemplate>
                <tr style="background-color: #FFCC66;font-weight: bold;color: #000080;">
                    <td>
                        <asp:ImageButton ID="DeleteButton" ImageUrl="images/delete.png" Width="20px" runat="server" CommandName="Delete" />
                        <%--<asp:Button ID="DeleteButton" runat="server" CommandName="Delete" 
                            Text="Delete" />--%>
                        <asp:ImageButton ID="EditButton" ImageUrl="images/edit.png" Width="20px" runat="server" CommandName="Edit" />
                        <%--<asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="Edit" />--%>
                    </td>
                    <td>
                        <asp:Label ID="QuestionLabel" runat="server" Text='<%# Eval("Question") %>' />
                    </td>
                    <td>
                        <asp:Label ID="Answer1Label" runat="server" Text='<%# Eval("Answer") %>' />
                    </td>
                    <td>
                        <asp:Label ID="CorrectAnswerLabel" runat="server" 
                            Text='<%# Eval("CorrectAnswer") %>' />
                    </td>
                    <td>
                        <asp:Label ID="AnswerExplanationLabel" runat="server" 
                            Text='<%# Eval("AnswerExplanation") %>' />
                    </td>
                    <td>
                        <asp:Label ID="QuestionOrderLabel" runat="server" 
                            Text='<%# Eval("QuestionOrder") %>' />
                    </td>
                </tr>
            </SelectedItemTemplate>
        </asp:ListView>
        </div>
        </ContentTemplate>
        </asp:UpdatePanel>

        <asp:SqlDataSource ID="SqlDataSource2" runat="server" 
            ConnectionString="<%$ ConnectionStrings:QuizSysDBConnectionString %>" 
            SelectCommand="SELECT     dbo.Question.Question, dbo.Question.QuestionOrder, dbo.Question.AnswerExplanation, dbo.Answers.Answer, dbo.QuestionImage.URL
                            FROM         dbo.Question INNER JOIN
                                                  dbo.QuizContent ON dbo.Question.QuestionID = dbo.QuizContent.QuestionID INNER JOIN
                                                  dbo.Answers ON dbo.QuizContent.AnswerID = dbo.Answers.AnswerID INNER JOIN
                                                  dbo.Quiz ON dbo.QuizContent.QuizID = dbo.Quiz.QuizID LEFT OUTER JOIN
                                                  dbo.QuestionImage ON dbo.Question.QuestionID = dbo.QuestionImage.QuestionID
                            WHERE     (dbo.QuizContent.QuizID = @QuizID)">
            <SelectParameters>
                <asp:ControlParameter ControlID="ListView1" Name="QuizID" 
                    PropertyName="SelectedValue" Type="Int32" />
            </SelectParameters>
        </asp:SqlDataSource>
    </div>

我现在的问题是如何让管理员能够按照他的意愿输入具有不同数量答案的问题。有人可以帮我吗?

4

1 回答 1

0

我一直在考虑这个和原型设计,我认为修改设计会更好地为您服务。与其尝试在两个列表视图中一页一页地做所有事情,不如模拟一个工作流并将其分布在多个页面上。在第一页上使用您的第一个 listView,它实现了您在 Quiz(zes) 表上所需的 CRUD 操作。对其进行编码,以便在选择特定测验时,通过将 QuizID 作为 URL 中的参数传递,将工作推进到新页面 - 示例:

Response.Redirect("Questions.aspx?quiz_id=1024");

或作为会话变量 - 示例:

会话[“quiz_id”] = 1024;Response.Redirect("Questions.aspx");

在这一点上,直到工作流程的后期才需要它,因为您没有在问题或答案表中使用 QuizID,但它稍后会派上用场。以与测验相同的方式为您的 listView 编写问题,然后继续回答并重复。

在管理员给出问题和答案后,将他们引导到一个集成页面(或多个页面),现在您终于可以使用您一直携带的 QuizID。或者,您可以提供一个小列表框来选择测验,每个 listBoxItem 的文本是标题和/或描述,值是 QuizID。

无论哪种方式,此时您都可以为问题和答案添加列表框以获取可用内容,并在它们旁边添加列表框以及所选内容。添加左右箭头按钮以前后移动两组框的选项。

此时,向页面添加一个保存按钮,并在单击事件上,使用 QuizID 变量以及来自所选问题和答案列表框的 QuestionID 和 AnswerID 对 QuizContents 表执行插入操作。如果您允许在这些列表框中的任何一个中使用多选模式,则必须循环此操作。

最后,有一个确认页面,他们可以在其中通过 QuizID 进行搜索,并一目了然地查看所有相关问题和答案。

于 2012-07-18T17:38:55.683 回答