クリックイベント後のブートストラップの折りたたみ状態の保持なし

Question

ブートストラップの折りたたみを使用しています。私は3つのパネルを設定し、各パネルにボタンを追加しています。私は、追加ボタン（パネル2）をクリックすると、ページをリフレッシュ取得し、それはその状態を保持しないと、結果としてそれが1

<div class="panel panel-default"> 
    <div class="panel-heading"> 
    <h4 class="panel-title"> 
     <a data-toggle="collapse" data-parent="#accordion" href="#collapse1" id="col1">Stock Detail</a> 
    </h4> 
    </div> 
    <div id="collapse1" class="panel-collapse collapse in"> 
    <div class="panel-body"> 
     <table class="table"> 
     <tr> 
      <td>Stock Name</td> 
      <td> 
      <asp:TextBox ID="tbstockname" runat="server" CssClass="form-control"></asp:TextBox> 
      <asp:RequiredFieldValidator ID="RequiredFieldValidator5" ValidationGroup="gp2" runat="server" ControlToValidate="tbstockname" ErrorMessage="Stock Name Required"></asp:RequiredFieldValidator> 
      </td> 
      <td>Client Name</td> 
      <td> 
      <asp:DropDownList ID="ddclientname" runat="server" CssClass="form-control"> 
      </asp:DropDownList> 
      </td> 
      <td> 
      <asp:Button ID="btnaddstock" runat="server" ValidationGroup="gp2" Class="btn btn-primary" Text="ADD" OnClick="btnaddstock_Click" /> 
      </td> 
     </tr> 
     <tr> 
      <td> 
      </td> 
     </tr> 
     </table> 
     <asp:GridView ID="gvstockdetail" class="table" runat="server" Width="500px"> 
     </asp:GridView> 
    </div> 
    </div> 
</div> 

Answer 1

あなたの問題は、サーバーコントロールを使用しているあるパネルを示しています。これで、サーバーへのポストバックが常にあります。いくつかは、あなたがhtml要素ではなく、サーバーの構成要素を使用する必要がある、とAjaxを使用して関数を呼び出します起きてからこのリフレッシュを防ぐために

OnClientClick="return false;" 

で運を持っているが。ような何か：

<input type="button" onclick="doAction()" /> 

そして、サーバーの動作にいくつかのAJAX呼び出しがありますAJAX呼び出しの詳細については

var doAction = function() { 
    //ajax call to your server 
}; 

をドキュメントを参照してください。

http://api.jquery.com/jquery.ajax/