如何开发这个依赖于另一个ListView的ListView?

时间:2012-07-17 05:17:42

标签: c# asp.net listview

我是一名新的ASP.NET开发人员,我正在尝试开发一个简单的测验引擎,允许系统管理员使用两个ListView创建测验。第一个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. 每个测验都有不同数量的问题,每个问题都有 不同数量的可能答案。例如,在其中一个测验中,我有两个问题。在第一个问题中,我有四个可能的答案,第二个问题将是真或假的问题。
  2. 有些问题可能会有一些问题。
  3. 此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>
    

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

1 个答案:

答案 0 :(得分:0)

我一直在考虑这个和原型设计,我认为通过修改设计会更好。可能最好是模拟工作流并将其分布在多个页面上,而不是尝试在两个listView中执行一页。在第一页上使用您的第一个listView,它在Quiz(zes)表上实现您想要的CRUD操作。对其进行编码,以便在选择特定测验时,通过将QuizID作为URL中的参数传递,将工作推进到新页面 - 示例:

  

的Response.Redirect( “Questions.aspx quiz_id = 1024?”);

或作为会话变量 - 示例:

  

Session [“quiz_id”] = 1024;的Response.Redirect( “Questions.aspx”);

此时,直到工作流程的后期才需要这个,因为你不在问题或答案表中使用QuizID,但它稍后会派上用场。使用与测验相同的方式对listView编码进行编码,然后前进到答案并重复。

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

无论哪种方式,此时您可以为问题和答案添加列表框以获取可用内容,并使用所选内容列出其旁边的列表框。添加左右箭头按钮可以为两组方框来回移动选项。

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

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