如何开发这个ListView的这依赖于另一个的ListView？ [英] How to develop this ListView which depends on another ListView?
问题描述
我是一个新的ASP.NET开发人员，我想开发一个简单的测验引擎，将允许系统管理员使用两个列表视图创建测验。用于插入测验标题和说明，以及第二ListView控件的第一ListView控件是插入的问题，答案（不同数量的答案），正确的答案，答案说明，问题顺序。
I am a new ASP.NET developer and I am trying to develop a simple Quiz Engine that will allow the System Administrator to create quizzes using two ListViews. The first ListView for inserting the Quiz title and description, and the second ListView is for inserting the question, answers (different number of answers), correct Answer, Answer Explanation, Question Order.
我有以下的数据库设计：
I have the following database design:
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：
The requirements that I have let me confused with binding the second ListView with the data:
- 每次测验都有不同数量的问题，每个问题有
不同数量的可能的答案。例如，在测验中的一个，我有两个问题。在第一个问题，我有四个可能的答案，第二个问题将是真或假的问题。 - 一些问题可能有一些图像。
这ListView控件应该支持原油业务。 那么怎么办呢？
This ListView should support CRUDE operations. So How to do that?
我的ASP.NET code为先的ListView：
My ASP.NET Code for the first ListView:
<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>
</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>
和我的code为第二次的ListView：
And my code for the Second 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>
</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>
我现在的问题是我怎么可以让管理员能够像他希望与不同数量的答案进入的问题。 任何人都可以请帮我在这？
推荐答案
我一直在想这件事，原型设计，我想你会通过修改设计得到更好的服务。而不是试图做的一切一一页两个列表视图，也许是preferable模拟工作流程和s $ P $垫这种过度多张网页。在第一页中使用自己的ListView中，它实现你的测验（ZES）表的愿望CRUD操作。 code这样，当选择了一个特定的测验，你推动工作再上新的一页，无论是通过传递QuizID作为URL中的一个参数 - 例如：
I've been thinking about this and prototyping, and I think you would be better served by modifying the design. Instead of trying to do everything one one page in two listViews, perhaps it is preferable to simulate a workflow and spread this over mulitple pages. On the first page use your first listView, which implements the CRUD operations you desire on the Quiz(zes) table. Code it so that when a particular quiz is selected, you advance the work to a new page, either by passing the QuizID as a parameter in the URL - Example:
的Response.Redirect（Questions.aspx quiz_id = 1024？）;
Response.Redirect("Questions.aspx?quiz_id=1024");
或作为一个会话变量 - 例如：
or as a session variable - Example:
会话[quiz_id] = 1024;的Response.Redirect（Questions.aspx）;
Session["quiz_id"] = 1024; Response.Redirect("Questions.aspx");
在这一点上，你并不需要这个，直到后来在工作流程，请你以后不要在问题或解答表使用QuizID，但后来它会派上用场。 code你的ListView的问题，你做的测验以同样的方式，然后推进到答案，并重复了。
at this point, you don't need this until later in the workflow, since you don't use QuizID in the Questions or Answers tables, but It will come in handy later. Code your listView for questions the same way you did for quizzes, and then advance to answers and repeat.
管理员给了问题和答案后，引导他们到一个集成页面（或网页），这里现在你终于可以用你一直携带QuizID。或者你可以提供一个小的列表框中选择一个测验，每个ListBoxItem中的文本为标题和/或描述，并作为QuizID的价值。
After the admin has given question and answers, direct them to an integration page (or pages), where now you can finally use the QuizID you've been carrying. Or you can provide a small listbox to choose a quiz, with each listBoxItem's text being the title and/or description, and the value being the QuizID.
无论哪种方式，在这一点上，你可以在他们旁边有选定的内容添加的问题与解答什么是可用的列表框，和列表框。加入左，右箭头键移动选择来回都套箱。
Either Way, at this point you can add listBoxes for the Questions and Answers for what's available, and listBoxes next to them with what is selected. Add left and right arrow buttons to move the options back and forth for both sets of boxes.
在这一点上，添加一个按钮，保存的页面并点击事件，在QuizContents表进行插入，使用QuizID变量，QuestionIDs和AnswerIDs从选定的问题来了，答案列表框。如果允许这两种列表框的多选模式，你将不得不回路此操作。
At this point, add a save button to the page and on the click event, perform an insert on the QuizContents table, using the QuizID variable, and the QuestionIDs and AnswerIDs coming from the selected Question and Answer listboxes. You will have to loop this operation if you allow a multiselect mode in either of these listboxes.
最后，有一个确认页面，在那里他们可以通过QuizID搜索和一目了然所有相关的问题和解答。
Finally, have a confirmation page where they can search by QuizID and see all associated questions and answers at a glance.
这篇关于如何开发这个ListView的这依赖于另一个的ListView？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
