aiswarjya1 Ответов: 0

Пример аккордеона Jquery


<button class="accordion">
         <div class="col-xs-8"><i class="fa fa-heart"></i>My Date Criteria</div>
          <div class="col-xs-3" style="padding:0">   <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Always">
                                                                   <ContentTemplate>
                                                                                 <asp:Label ID="Label11" runat="server" Text="Field Empty"></asp:Label>
                                                                       <asp:Label ID="lblMydate" runat="server"></asp:Label>

                                                                   </ContentTemplate>
                                                               </asp:UpdatePanel></div>
         </button>
         <div id="Div1" class="panel">
           <div class="content_new">
                    <table style="width:90%;">
                       <tbody>
                           <tr>
                               <td>I Want</td>
                               <td width="10%">  : </td>
                               <td> <asp:DropDownList ID="ddlIwant" runat="server" Width="250px" CssClass="gender" Visible="false">
                                                           <asp:ListItem Value="1">Male</asp:ListItem>
                                                           <asp:ListItem Value="2">Female</asp:ListItem>
                                                       </asp:DropDownList>
                                                       <asp:Literal ID="litWant" runat="server"></asp:Literal></td>
                           </tr>
                           <tr>
                               <td>Age Between</td>
                               <td>:</td>
                               <td>
                                   <asp:DropDownList ID="ddlAgeFrom" runat="server" CssClass="age_between" Visible="false">
                                                                   </asp:DropDownList>
                                                                   <asp:Literal ID="litAgeFrom" runat="server"></asp:Literal>
                                     to
                                <asp:DropDownList ID="ddlAgeTo" runat="server" CssClass="age_between" Visible="false">
                                                                   </asp:DropDownList>
                                                                   <asp:Literal ID="litAgeTo" runat="server"></asp:Literal>

                               </td>
                           </tr>
                           <tr>
                               <td>About My Date   </td>
                               <td>:</td>
                               <td>

                                    <asp:TextBox ID="txtAboutDate" runat="server" TextMode="MultiLine"  class="aspNetDisabled textbox"

                                  Style="resize: none; color:black;" Enabled="false"></asp:TextBox>

                               </td>
                           </tr>


                         <asp:DropDownList ID="ddlFrndState" runat="server" Width="250px" CssClass="gender" Visible="false">
                                                       </asp:DropDownList>
                                                       <asp:Literal ID="litFrndState" runat="server" Visible="false"></asp:Literal>

                       </tbody>

                    </table><br/>


<asp:Button ID="imgbtnSaveM" runat="server" Text="Save" OnClick="imgbtnSaveM_Click" Visible="false"

                                                        class="button" />
                                                       <asp:Button ID="imgbtnEditM" runat="server" Text="Edit"

                                                   class="button" OnClick="imgbtnEditM_Click" />

                    </div>
         </div>
       </div>

var acc = document.getElementsByClassName("accordion");
         var i;

         for (i = 0; i &lt; acc.length; i++) {
             acc[i].onclick = function (e) {
                 e.preventDefault();
                 this.classList.toggle("active");
                 this.nextElementSibling.classList.toggle("show");
             }
         }


*** когда я нажал кнопку редактирования, панель была закрыта.
но он должен быть открыт на панели и показать, что кнопка сохранения должна быть показана.

Что я уже пробовал:

*** когда я нажал кнопку редактирования, панель была закрыта.
но он должен быть открыт на панели и показать, что кнопка сохранения должна быть показана.

Bryian Tan

код, который вы разместили здесь, не является полным. во всяком случае, я предлагаю реализовать это на стороне клиента. При нажатии кнопки edit вызовите onclientclick, который сделает кнопку save отображаемой/видимой (visibility:visible) в пользовательском интерфейсе. Удалите Visible= "false" из кнопки save и скройте его с помощью css (visibility:hidden).

http://stackoverflow.com/questions/5480988/jquery-ui-widget-accordion-open-with-external-button-control
https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.onclientclick(v=vs. 110).aspx

0 Ответов