0

下午所有,ASP.Net CollapsiblePanelextender控制

我wonding如果我可以配置並在表格內使用ASP.net一個collapsiblePanelextender。我想將其用於我正在創建的會議系統的會議記錄。我有以下代碼,並認爲如果我添加pnlPresenter和pnlTime與pnlHeader一起CollapseControlID我將能夠得到這個工作,但我不能。

有沒有人有任何其他建議?

<table width="100%"> 
    <tr> 
      <td class="style3">Topic</td> 
      <td class="style2">Presenter</td> 
      <td>Time Alloted</td> 
    </tr> 
    <tr > 
      <td class="style1" colspan="3"> 
      <asp:Panel ID="pnlHeader" runat="server" CssClass="cpHeader" Width="228%" Height="18px"> 
       1. Agenda Item 1 
      <asp:Image ID="ImgToggle" runat="server" ImageUrl="~/Images/collapse.jpg" ImageAlign="Middle" /> 
      </asp:Panel> 
      </td> 
    </tr> 
    <tr> 
      <td class="style3"> 
      <asp:Panel ID="pnlInfo" runat="server" CssClass="cpBody" > 
       The Agenda topic details goes within here, The Agenda topic details goes within here, 
       The Agenda topic details goes within here, The Agenda topic details goes within here,. 
      </asp:Panel> 
      </td> 
      <td class="style2"> 
      <asp:Panel ID="pnlPresenter" runat="server" CssClass="cpBody" Width="107px"> 
       Presenters Name 
      </asp:Panel> 
      </td> 
      <td class="style2"> 
      <asp:Panel ID="pnlTime" runat="server" CssClass="cpBody" Width="107px"> 
       Time 
      </asp:Panel> 
      </td> 
     </tr> 
</table> 

提前

問候非常感謝 貝蒂

回答

0

這不是完全清楚你想要什麼在這裏實現,特別是有在標記沒有CollapsiblePanelExtender你張貼,所以我這是假設你想要顯示一個會議的頁面,其中每個議程項目是可展開/可摺疊的。

我建議你使用Repeater構建表格,而不是將其硬編碼到您的頁面中,然後對於每個議程項目,Repeater可以爲您呈現一個新行。在由Repeater呈現的行內部,您可以將議程主題作爲標題,並將議題項目詳細信息作爲使用擴展程序展開/摺疊的面板:

<asp:Repeater runat="server" ID="AgendaRepeater" DataSourceID="AgendaDataSource"> 
    <HeaderTemplate> 
     <table border="1"> 
      <tr> 
       <td> 
       </td> 
      </tr> 
    </HeaderTemplate> 
    <ItemTemplate> 
     <tr> 
      <td> 
       <asp:Label runat="server" ID="AgendaTopicLabel" Text='<%# Eval("Topic") %>' /> 
       <asp:ImageButton runat="server" ID="PanelExpandContractImageButton" ImageUrl="~/images/zoom_in_16x16.gif" /> 
       <asp:Panel runat="server" ID="AgendaItemDetailsPanel" Height="0px"> 
        <asp:Label runat="server" ID="TopicDetailsLabel" Text='<%# Eval("Details") %>' /><br /> 
        <asp:Label runat="server" ID="PresenterLabel" Text='<%# Eval("Presenter") %>' /><br /> 
        <asp:Label runat="server" ID="TimeLabel" Text='<%# Eval("Time") %>' /> 
       </asp:Panel> 
       <ajaxToolkit:CollapsiblePanelExtender runat="server" TargetControlID="AgendaItemDetailsPanel" 
         Collapsed="true" ExpandControlID="PanelExpandContractImageButton" CollapseControlID="PanelExpandContractImageButton" 
         ImageControlID="PanelExpandContractImageButton" CollapsedImage="~/images/zoom_in_16x16.gif" 
         ExpandedImage="~/images/zoom_out_16x16.gif" ExpandedSize="100" ExpandDirection="Vertical" 
         ScrollContents="true" /> 
      </td> 
     </tr> 
    </ItemTemplate> 
    <FooterTemplate> 
     </table> 
    </FooterTemplate> 
</asp:Repeater> 
+0

非常感謝。我已經按照你的建議使用了中繼器,這是一種享受。 – Betty