javascript - トグルでリピーター

Question

リピーターでは、clcik で行 (クラス ヘッダー) を展開できます。もう一度クリックすると折りたたまれます。これは正常に機能しています。

すべての行を同時に展開および折りたたむことができます。一度に 1 つの行 (クラス ヘッダー) を展開したいです。 .

ありがとう

編集

どうもありがとうございます。row1 をクリックすると拡大し、row2 をクリックすると、row1 が折りたたまれ、row2 が拡大します。しかし、row1(クラスヘッダー)をクリックすると展開されますが、もう一度row1をクリックすると折りたたむ必要があります.それは機能していません

<script language="JavaScript">



function ToggleDisplay(id) {
    var elem = document.getElementById('d' + id);
    if (elem) {
        if (elem.style.display != 'block') {
            elem.style.display = 'block';
            elem.style.visibility = 'visible';
        }
        else {
            elem.style.display = 'none';
            elem.style.visibility = 'hidden';
        }
    }
}

<style>
    .header { font-size: larger; font-weight: bold; cursor: hand; cursor:pointer;
           background-color:#cccccc; font-family: Verdana; }
  .details { display:none; visibility:hidden; 
             font-family: Verdana; }
</style>

    &nbsp;<div style="overflow: scroll; overflow-x: hidden; overflow-y: auto;background-color:gray; height: 500px; width: 895px">

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">

         <ItemTemplate>


 <div id='h<%# DataBinder.Eval(Container, "ItemIndex") %>' class="header"
      onclick='ToggleDisplay(<%# DataBinder.Eval(Container, "ItemIndex") %>);' style="border-style: none;">
     <asp:Panel ID="Panel3" runat="server" Height="30px" BorderStyle="None" BackColor="#79FFFF">

    <%# DataBinder.Eval(Container.DataItem, "License")%> 
   <%# DataBinder.Eval(Container.DataItem, "Name")%>

   <%# DataBinder.Eval(Container.DataItem," Date")%>
  </asp:Panel> 
 </div>

 <div id='d<%# DataBinder.Eval(Container, "ItemIndex") %>' class="details">

  <asp:Panel ID="Panel2" runat="server" Height="195px" BackColor="Gray" Font-Bold="False" ForeColor="Maroon">
  <br />
      <asp:Label ID="Label1" runat="server" Text="LicenseID"></asp:Label>&nbsp;&nbsp;&nbsp;&nbsp;

                <asp:TextBox ID="TextBox1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"LicenseID") %>' Enabled="False" BackColor="Gray" BorderStyle="None"></asp:TextBox>
      <asp:Label ID="Label2" runat="server" Text="License Name"></asp:Label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <asp:TextBox ID="TextBox2" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"LicenseName")%>' Enabled="false" BackColor="Gray" BorderStyle="None"></asp:TextBox>

            </asp:Panel>

 </div>

        </ItemTemplate>