ASP.Net CollapsiblePanelextenderコントロール

Question

午後すべて、

私はテーブル内ASP.netでcollapsiblePanelextenderを設定して使用することができる場合、私はwondingています。私はこれを、私が作成している会議システムの議事録に使用するつもりです。私は次のコードを持っていて、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> 

多くのおかげ ベティ

Answer 1

そうではありません完全あなたが投稿したマークアップにはCollapsiblePanelExtenderありません、特にとして、ここで達成したいので、どのような明確なI各アジェンダ項目が展開/折りたたみ可能な会議のページを表示したいという前提でこれを書いています。

あなたのページにハードコーディングするのではなく、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>