Загрузочный лоток: вкладки внутри модального Я сделал moda dialogl, и теперь я пытаюсь вставить в него вкладки, но не могу получить вкладки для отображения содержимого. Частичный код вкладок: http://plnkr.co/edit/eGRmkzDvo4lYGCjzA5q7 Как разместить вкладки внутри модального? Ответ 1 http://plnkr.co/edit/Oj681B1YbLU1dJEiWHZp?p=preview <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script> <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js"></script> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h3 ng-hide="newUser">Heading</h3> </div> <ul class="nav nav-tabs" id="tabContent"> <li class="active"><a href="#details" data-toggle="tab">Details</a></li> <li><a href="#access-security" data-toggle="tab">Access / Security</a></li> <li><a href="#networking" data-toggle="tab">Networking</a></li> </ul> <div class="tab-content"> <div class="tab-pane active" id="details"> Details tab <div class="control-group"> <label class="control-label">Instance Name</label> </div> </div> <div class="tab-pane" id="access-security"> content 0 </div> <div class="tab-pane" id="networking"> content 1 </div> </div> Ответ 2 Вам не хватает атрибута data-toggle: <li><a href="#details" data-toggle="tab">Details</a></li> И активное состояние для любой вкладки, которую вы хотите отобразить первым: <li class="active"><a href="#details" data-toggle="tab">Details</a></li> <div class="tab-pane active" id="details">
Ответ 1 http://plnkr.co/edit/Oj681B1YbLU1dJEiWHZp?p=preview <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script> <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js"></script> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h3 ng-hide="newUser">Heading</h3> </div> <ul class="nav nav-tabs" id="tabContent"> <li class="active"><a href="#details" data-toggle="tab">Details</a></li> <li><a href="#access-security" data-toggle="tab">Access / Security</a></li> <li><a href="#networking" data-toggle="tab">Networking</a></li> </ul> <div class="tab-content"> <div class="tab-pane active" id="details"> Details tab <div class="control-group"> <label class="control-label">Instance Name</label> </div> </div> <div class="tab-pane" id="access-security"> content 0 </div> <div class="tab-pane" id="networking"> content 1 </div> </div>
Ответ 2 Вам не хватает атрибута data-toggle: <li><a href="#details" data-toggle="tab">Details</a></li> И активное состояние для любой вкладки, которую вы хотите отобразить первым: <li class="active"><a href="#details" data-toggle="tab">Details</a></li> <div class="tab-pane active" id="details">