2016-10-03 54 views
0

我已經把模式內的按鈕插件(html在下面),但按鈕不會連接到輸入文本,因爲它應該。我曾嘗試在col-md-6中添加按鈕插件,它只能幫助桌面視圖,但在移動設備中仍然無法正常工作。有任何想法嗎?哪個CSS規則阻止它加入按鈕?Bootstrap按鈕插件不能正確顯示在引導模式內

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"> 
    <div class="modal-dialog" role="document"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
       <h4 class="modal-title" id="exampleModalLabel">Some text: <span id="numberOfMatches"></span>.</h4> 
      </div> 
      <div class="modal-body">        
        <div class="input-group">          
         <input type="text" class="form-control" id="modalCustomerNameInput" placeholder="Customer name.."> 
         <span class="input-group-btn"> 
          <button class="btn btn-default" type="button" data-request-url="..." onclick="SelectCustomer(customerCode.value, $(this).data('request-url'))"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button> 
         </span> 
        </div>  
       <div class="list-group" id="customersListInModal">         
       </div> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>         
      </div> 
     </div> 
    </div> 
</div> 
+2

適用於我:http://www.bootply.com/T6nHy4Cmt4 - 我懷疑你沒有顯示的東西影響佈局 –

+0

謝謝你們,它真的在引導工作,我試圖複製我的頁面並且它顯示正確,我也將bootstrap更新爲bootply中使用的相同版本,但仍無法解決它。無論如何感謝您的時間,我會稍後再次審查.. –

+0

您可能會覺得這有幫助:http://stackoverflow.com/help/mcve –

回答

0

你有一個inputbutton行動,但它們含有不<form>標籤。

嘗試使button爲nchor標記,然後在調用其他函數之前使用preventDefault()方法。

+0

不幸的是,它也沒有幫助... –