2015-01-15 2 views
0

Я использую twitter bootstrap в своем последнем проекте. Все работает отлично, за исключением одной из страниц.Bootstrap modal issue

Нажав на ссылку, вы получите модаль, которую я могу закрыть, используя кнопку закрытия или значок закрытия в правом верхнем углу модального.

Однако я закрываю модальный, используя кнопку закрытия, а затем пытаюсь открыть его снова (или любую другую ссылку, если на то пошло) кнопка закрытия отключена, и я могу закрыть только модальную форму, используя верхний правый значок.

Ниже приведена ссылка на jsfiddle с копией кода, в котором вы можете видеть результаты в прямом эфире.

Существует только один модаль, к которому данные будут переданы по ссылке, однако это еще не реализовано.

<h3>Select a role to edit it.</h3> 
<div style="width:auto"> 
<ul class="nav nav-pills nav-stacked"> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(920)Active Directory Management</a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(904)Cisco Router - Administration </a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(914)Cisco Router - Installation</a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(918)Development - Analysis</a></li><li><a href="#" data-toggle="modal" data-target="#roleEditModal">(908)Development - Project Management</a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(936)Fire Wall - Administration</a></li> 
</ul> 
</div>   
     <!-- Modal --> 
     <div class="modal" id="roleEditModal" tabindex="-1" role="dialog" aria-labelledby="roleEditModalLabel" aria-hidden="true"> 
      <div class="modal-dialog"> 
      <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> 
      <h4 class="modal-title" id="editModal">Edit role:</h4> 
      </div> 
      <div class="modal-body"> 

      </div> 
      <div class="modal-footer"> 
      <button type="button" id="btn_roleEditClose" class="btn btn-default" data-dismiss="modal">Cancel</button> 
</div> 
</div> 
</div> 
</div> 

http://jsfiddle.net/dzfbyu6t/

Может кто-нибудь взглянуть на него, и дайте мне знать, где моя проблема. Thank

ответ

1

Добавленный javascript вызывает проблему.

$(".btn").click(function(e) { 
    if (! $(this).hasClass("disabled")) 
     { 
      $(".disabled").removeClass("disabled").attr("rel", null); 

      $(this).addClass("disabled").attr("rel", "tooltip"); 
     } 
    }); 

если вы закомментируете это работает хорошо. http://jsfiddle.net/dzfbyu6t/1/