2017-01-10 87 views
0

我正在为我的网站实施此selectpicker。我遇到了一个问题,它有一个selectpicker类的元素,它不会显示在我的DOM上。引导选择不工作模式内

这里是代码

<div id="modal-container" class="modal fade hidden-print" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false"> 
    <div class="modal-dialog"> 
     <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="myModalLabel">Add New Experience</h4> 
    </div> 

     <div id="addExperience" class="modal-body"> 
      <div class="form-horizontal"> 
       <div class="form-group"> 
           <div class="col-md-12"> 
            <select class="user-form selectpicker show-tick form-control" data-live-search="true"> 
             <option>A</option> 
            </select> 
           </div> 
          </div> 
      </div> 

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

请帮我在轨道上我的开发得到。

谢谢!

+0

看起来不错给我https://plnkr.co/edit/HHxNkpbUITBQJBSHaJQ8?p=preview – Deep

+0

我不知道为什么它不是我的最终呈现。我总是把这个css属性放到我的'select.selectpicker {display:none!important;'你有什么想法如何解决这个问题? – Terence

+0

你能用你的完整代码创建一个plunker吗?将看看 – Deep

回答

0

您需要添加以下所需的资源,在您的plunker例如

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> 
    </script> 
<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/css/bootstrap-select.min.css"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/bootstrap-select.min.js"></script> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/i18n/defaults-en_US.js"></script> 

,事情做工精细:)

让我知道的情况下,实际的代码仍然从plunker不同。

例子:https://plnkr.co/edit/4gJBAu3NKUQp1HMUbrK9?p=preview