2012-07-25 94 views
0

我是一名新的ASP.NET开发人员,我必须创建一个测验引擎应用程序。我正在使用ListView在特定测验下插入问题。如何在此ListView中插入用于插入其他内容的图像?

我有以下的数据库设计:

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

我现在想的是使管理员能够将图像使嵌入到这些问题的任何一个。 我该怎么做,因为我在数据库中有两个不同的表格?一个用于上述设计中显示的问题和一个图像。我有这个设计,因为不是所有的问题都会有图像。除此之外,我可能有两个或三个问题或更多具有相同的图像。

我知道我不应该张贴太多的代码或信息,但我必须这样做,要清楚:

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

      <EditItemTemplate> 

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

         <asp:ImageButton ID="CancelButton" ImageUrl="Images/icons/cancel324.png" ToolTip="Cancel" runat="server" CommandName="Cancel" /> 
        </td> 
        <td> 
         <asp:TextBox ID="QuestionTextBox" runat="server" 
          Text='<%# Bind("Question") %>' /> 
        </td> 
        <td> 
         <asp:TextBox ID="QuestionOrderTextBox" runat="server" 
          Text='<%# Bind("QuestionOrder") %>' /> 
        </td> 
        <td> 
         <asp:TextBox ID="AnswerExplanationTextBox" runat="server" 
          Text='<%# Bind("AnswerExplanation") %>' /> 
        </td> 
        <%--<td> 
         <asp:TextBox ID="UrlTextBox" runat="server" Text='<%# Bind("Url") %>' /> 
        </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/add24.png" ToolTip="Add" runat="server" CommandName="Insert" /> 

         <asp:ImageButton ID="CancelButton" ImageUrl="Images/icons/clear24.png" ToolTip="Cancel" runat="server" CommandName="Cancel" /> 
        </td> 
        <td> 
         <asp:TextBox ID="QuestionTextBox" runat="server" 
          Text='<%# Bind("Question") %>' /> 
        </td> 
        <td> 
         <asp:TextBox ID="QuestionOrderTextBox" runat="server" 
          Text='<%# Bind("QuestionOrder") %>'/> 
        </td> 
        <td> 
         <asp:TextBox ID="AnswerExplanationTextBox" runat="server" 
          Text='<%# Bind("AnswerExplanation") %>' /> 
        </td> 
        <%--<td> 
         <asp:FileUpload ID="ImageIDUploader" runat="server" size="10" /> 
         </td>--%> 
       </tr> 

      </InsertItemTemplate> 

      <ItemTemplate> 
       <tr style=""> 
        <td> 
         <asp:ImageButton ID="DeleteButton" ImageUrl="Images/icons/delete24.png" ToolTip="delete" runat="server" CommandName="Delete" /> 

         <asp:ImageButton ID="EditButton" ImageUrl="Images/icons/edit24.png" ToolTip="Edit" runat="server" CommandName="Edit" /> 

         <asp:ImageButton ID="SelectButton" ImageUrl="Images/icons/select.png" ToolTip="Select" runat="server" CommandName="Select" /> 
        </td> 
        <td> 
         <asp:Label ID="QuestionLabel" runat="server" Text='<%# Eval("Question") %>' /> 
        </td> 
        <td> 
         <asp:Label ID="QuestionOrderLabel" runat="server" 
          Text='<%# Eval("QuestionOrder") %>' /> 
        </td> 
        <td> 
         <asp:Label ID="AnswerExplanationLabel" runat="server" 
          Text='<%# Eval("AnswerExplanation") %>' /> 
        </td> 
        <%--<td> 
          <a href='<%# Eval("URL") %>' target="_blank"> 
           <asp:Label ID="ImageURLlbl" runat="server" Text='<%# Eval("URL") %>' /> 
          </a> 
         </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; ">Question Order</th> 
           <th style="border-bottom:2px solid #003366; ">Answer Explanation</th> 
           <th style="border-bottom:2px solid #003366; ">Image (URL)</th> 
          </tr> 
         </thead> 
         <tbody><tr id="itemPlaceholder" runat="server"></tr></tbody> 
        </table></div>  
      </LayoutTemplate> 
      <SelectedItemTemplate> 
       <tr style=""> 
        <td> 
         <asp:ImageButton ID="DeleteButton" ImageUrl="Images/icons/delete24.png" ToolTip="Delete" runat="server" CommandName="Delete" /> 

         <asp:ImageButton ID="EditButton" ImageUrl="Images/icons/edit24.png" ToolTip="Edit" runat="server" CommandName="Edit" /> 
        </td> 
        <td> 
         <asp:Label ID="QuestionLabel" runat="server" Text='<%# Eval("Question") %>' /> 
        </td> 
        <td> 
         <asp:Label ID="QuestionOrderLabel" runat="server" 
          Text='<%# Eval("QuestionOrder") %>' /> 
        </td> 
        <td> 
         <asp:Label ID="AnswerExplanationLabel" runat="server" 
          Text='<%# Eval("AnswerExplanation") %>' /> 
        </td> 
        <%--<td> 
          <asp:Label ID="ImageURLlbl" runat="server" 
           Text='<%# Eval("URL") %>' /> 
         </td>--%> 
       </tr> 
      </SelectedItemTemplate> 
     </asp:ListView> 
     </div> 

     <asp:SqlDataSource ID="SqlDataSource2" runat="server" 
      ConnectionString="<%$ ConnectionStrings:QuizSysDBConnectionString %>" 
      SelectCommand="SELECT  QuestionID, Question, QuestionOrder, AnswerExplanation 
          FROM   dbo.Question 
          WHERE  (QuestionID IN 
                 (SELECT DISTINCT QuestionID 
                 FROM   dbo.QuizContent 
                 WHERE  (QuizID = @QuizID)))" 

      DeleteCommand="DELETE FROM [Question] WHERE [QuestionID] = @QuestionID" 
      InsertCommand="INSERT INTO [Question] ([Question], [QuestionOrder], [AnswerExplanation]) VALUES (@Question, @QuestionOrder, @AnswerExplanation)" 


      UpdateCommand="UPDATE [Question] SET [Question] = @Question, [QuestionOrder] = @QuestionOrder, [AnswerExplanation] = @AnswerExplanation WHERE [QuestionID] = @QuestionID"> 

       <DeleteParameters> 
        <asp:Parameter Name="QuestionID" Type="Int32" /> 
       </DeleteParameters> 
       <InsertParameters> 
        <asp:Parameter Name="Question" Type="String" /> 
        <asp:Parameter Name="QuestionOrder" Type="Int32" /> 
        <asp:Parameter Name="AnswerExplanation" Type="String" /> 
        <asp:ControlParameter ControlID="ListView1" Name="QuizID" PropertyName="SelectedValue" Type="Int32" /> 
       </InsertParameters> 
       <UpdateParameters> 
        <asp:Parameter Name="Question" Type="String" /> 
        <asp:Parameter Name="QuestionOrder" Type="Int32" /> 
        <asp:Parameter Name="AnswerExplanation" Type="String" /> 
       </UpdateParameters> 

      <SelectParameters> 
       <asp:ControlParameter ControlID="ListView1" Name="QuizID" DefaultValue="0" 
        PropertyName="SelectedValue" Type="Int32" /> 
      </SelectParameters> 
     </asp:SqlDataSource> 

那么怎么办呢?

回答

1

不要在同一个列表视图中添加图像,而是要显示选择的现有图像,并添加另一个选项以打开弹出窗口,其中包含所有图像的列表以及用于上载新图像的选项。

创建视图结合起来的问题和图像:

CREATE VIEW QuestionsView AS 
SELECT Question.*, QuestionImage.ID AS ImageID 
FROM Question LEFT OUTER JOIN QuestionImage ON Question.QuestionID = QuestionImage.QuestionID 

使用此视图来选择适合您的ListView记录。

要显示一个DropDownList:

<td> 
    <asp:DropDownList runat="server" DataSourceID="imagesDataSource" SelectedValue="<%# Bind("ImageID") %>" DataTextField="URL" DataValueField="ID" /> 
    <asp:SqlDataSource runat="server" ID="imagesDataSource" SelectCommand="SELECT * FROM QuestionImage" /> 
</td> 

更改为使用存储过程的更新是获取每个绑定使用参数您的ListView数据源。

添加一个链接到打开图片列表弹出。对于弹出窗口,您可以在此处使用其中一个示例:http://smashingspy.com/32-best-jquery-popup-window-dialog-box-example/

+0

由于我是新的ASP.NET开发人员,可否请您提供示例或代码段? – 2012-07-25 06:42:43

+0

刚刚编辑我的答案 – 2012-07-25 06:58:29

+0

我可以使用SqlDataSource而不是ObjectDataSource吗?此外,Image对象的QuestionID与您所假设的不一样,所以它可以吗? – 2012-07-25 07:02:19