2014-02-10 49 views
0

我遇到了一個有趣的困境。我試圖創建一個可摺疊的div來保存我的數據,到目前爲止它不起作用。我認爲這可能是jQuery給我的噩夢,但引用它後,我仍然遇到同樣的問題。一旦我點擊摺疊/展開。它什麼都不做。你們能看到什麼不對嗎?data-toggle =「collapse」在點擊時不會摺疊我的數據

<div class="panel-group" id="accordion" style="margin-top: 15px"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h4 class="panel-title"> 
       <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Complete Database Export</a> 
       <small style="margin-left: 10px">(click here)</small> 
      </h4> 
     </div> 
     <div id="collapseOne" class="panel-collapse collapse in"> 
      <div class="panel-body"> 

       <div class="row" style="text-align: center; margin-top: 10px"> 
        <asp:Label runat="server" CssClass="label">Complete Database Export</asp:Label> 
        <table style="width: 100%; margin-top: 10px"> 
         <tr> 
          <td> 
           <p class="fg-color-grey">Enter the email addresses where the report will be sent to, seperated by commas:</p> 
          </td> 
         </tr> 
         <tr> 
          <td style="text-align: center"> 
           <asp:TextBox ID="txtDumpEmails" runat="server" CssClass="genericTextBox widthOverride"></asp:TextBox> 
          </td> 
         </tr> 
         <tr> 
          <td> 
           <asp:Button ID="btnDump" runat="server" Text="Generate Complete Database Export" CssClass="simpleButton marginOverride" OnClick="btnDatabaseDump_Click" /> 
          </td> 
         </tr> 
        </table> 

       </div> 

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

有什麼我可以嘗試檢查或我忘記了嗎? 在此先感謝。目前我對此感到非常沮喪。

編輯

我還應該注意到,我沒有得到在Web控制檯檢查任何錯誤。

回答

0

好吧,你有會做的摺疊/展開,但它是在下面的代碼,即

<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Complete Database Export</a> 

,而不是鏈接代碼:

<small style="margin-left: 10px">(click here)</small> 

擴展屏幕截圖

Expanded

倒塌的屏幕如果選擇「完整的數據庫導出」鏈接它不exanding /摺疊,你需要檢查所有引導資源文件加載正確的拍攝

Collapsed

我猜在js文件是缺失的,你可以通過引用CDN即

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 
測試