ポストバック後にブートストラップコラプスを無効にする

Question

私のプロジェクトでブートストラップコラプスを使用しています。その中にはいくつかのボタンとドロップダウンがありますが、ボタンをクリックするかドロップダウンリストを変更するとポストバックが発生し、この ？ここで は私のコードである

<h4><a href="#" data-toggle="collapse" data-target="#div_search" style="font-weight: bold;">Search Training Profile</a><br /> 
       </h4> 
       <div id="div_search" class="collapse" style="overflow-x: auto;"> 
        <table class="table table-bordered table-striped"> 
         <tr> 
          <td>Employee Name</td> 
          <td> 
           <asp:TextBox runat="server" ID="txt_name"></asp:TextBox> 
           <span class="err">optional</span> 

          </td> 
          <td>e.g First Name, Middle Name, Last Name</td> 
         </tr> 
         <tr> 
          <td>Designation</td> 
          <td><span class="err"></span> 
           <asp:DropDownList runat="server" ID="DDL_Desig" OnSelectedIndexChanged="DDL_Desig_SelectedIndexChanged" AutoPostBack="true"> 
           </asp:DropDownList> 
           <span class="err">optional</span> 
          </td> 
          <td> 
           <asp:TextBox runat="server" ID="txt_desig" ReadOnly="true"></asp:TextBox> 
           <asp:Button Text="Clear" runat="server" /> 
          </td> 
         </tr> 
         <tr> 
          <td>Location</td> 
          <td> 
           <asp:DropDownList runat="server" ID="DDL_Loc" OnSelectedIndexChanged="DDL_Loc_SelectedIndexChanged" AutoPostBack="true"> 
            <asp:ListItem>Select</asp:ListItem> 
           </asp:DropDownList> 
           <span class="err">optional</span> 
           </td> 

          <td> 
           <asp:TextBox runat="server" ID="txt_loc" ReadOnly="true"></asp:TextBox> 
           <asp:Button Text="Clear" runat="server" /> 
          </td> 
         </tr> 
         <tr> 
          <td>Division</td> 
          <td> 
           <asp:DropDownList runat="server" ID="DDL_Divis" OnSelectedIndexChanged="DDL_Divis_SelectedIndexChanged" AutoPostBack="true"> 
           </asp:DropDownList> 
           <span class="err"> optional </span> 

          </td> 
          <td> 
            <asp:TextBox runat="server" ID="txt_divis" ReadOnly="true"></asp:TextBox> 
           <asp:Button Text="Clear" runat="server" /> 
           </td> 
         </tr> 
         <tr> 
          <td>Department</td> 
          <td> 
           <asp:TextBox runat="server" ID="tx"></asp:TextBox> 
           <span class="err">optional</span></td> 
          <td>e.g ISD, MKT, HR etc</td> 
         </tr> 
         <tr> 
          <td>Filter By</td> 
          <td> 
           <asp:DropDownList runat="server" ID="DDL_Assc"> 
           </asp:DropDownList> 
          </td> 
          <td>e.g OLP, SOLC, MAF, etc</td> 
         </tr> 
         <tr> 

          <td colspan="3">&nbsp;</td> 
         </tr> 
         <tr> 
          <td colspan="3" style="text-align:center;"> 
           <asp:Button Text="Search" runat="server" CssClass="btn" /> 
           <asp:Button Text="Reset" runat="server" CssClass="btn" /> 
          </td> 
         </tr> 
        </table> 

       </div> 

Answer 1

ポストバックするか、ドロップダウン時にパブリック変数

string state = "collapse"; 

を作成

state = "expand"; 

とaspxページを使用し、以下のように、このよう値を設定変更： -

<div id="div_search" class='<%= state %>' style="overflow-x: auto;"> 

Answer 2

Adityaの答えは私を最初に助け、素晴らしい解決策です。私のコードが更新パネルの中にdivをラップし、折り畳みdivに、ポストバックがグリッド内のデータをリフレッシュさせるカップルのカレンダーコントロールを含むようになったので、共有する価値があると思いました。

<asp:Panel ID="pnlDateRange" ClientIDMode="Static" runat="server" CssClass="collapse col-xs-12 col-sm-12 col-md-12 col-lg-12"> 
    <div id="divFrom" class="col-xs-12 col-sm-12 col-md-2 col-md-offset-4 col-lg-2 col-lg-offset-4"> 
    <asp:Calendar ID="cStartDate" runat="server" CssClass="calendar" Font-Size="X-Small" 
           DayNameFormat="FirstTwoLetters" DayHeaderStyle-Font-Bold="false" 
           TitleStyle-Font-Bold="true" TitleStyle-Font-Size="Small" Caption="From" 
           OnSelectionChanged="cStartDate_SelectionChanged"> 
           <SelectedDayStyle Font-Bold="true" /> 
           <OtherMonthDayStyle ForeColor="SlateGray" /> 
          </asp:Calendar> 
         </div> 
     <div id="divTo" class="col-xs-12 col-sm-12 col-md-2 col-lg-2"> 
      <asp:Calendar ID="cEndDate" runat="server" CssClass="calendar" Font-Size="X-Small" 
           DayNameFormat="FirstTwoLetters" DayHeaderStyle-Font-Bold="false" 
           TitleStyle-Font-Bold="true" TitleStyle-Font-Size="Small" Caption="To" 
           OnSelectionChanged="cEndDate_SelectionChanged"> 
           <SelectedDayStyle Font-Bold="true" /> 
           <OtherMonthDayStyle ForeColor="SlateGray" /> 
       </asp:Calendar> 
      </div> 
     </asp:Panel> 

コントロールはもともと同じクラスが適用された通常のもので、折りたたみターゲットです。サーバーサイドのC＃では、コードがロードされて実行されるすべてのケースで、プライベートブール変数をtrueに設定して定義しました。 OnPreRenderイベントでは、私はこれを行います：

if (_collapseRange) 
{ 
    pnlDateRange.CssClass = pnlDateRange.CssClass.Replace("collapse in", "collapse"); 
} 
else 
{ 
    if (!pnlDateRange.CssClass.Contains("collapse in")) 
    { 
     pnlDateRange.CssClass = pnlDateRange.CssClass.Replace("collapse", "collapse in"); 
    } 
}