On one page I have tabs content , in which in one of the tabs there is a button that calls modal content . When I click on the button, the modal appears and the tab immediately disappears with the tab on which the button was pressed. When closing modal , tab not returned. Through the debager, I see that the tab overlaid display:none; .

How to avoid it?

Even if I call the window through a link in the table, which is in the same tab as the button, then I call the modal большой (as it should be) and the tab also unfolds with the deployment animation. Tabs switch without scripts.

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <ul class="nav nav-tabs" id="tab_view"> <li class="active"><a href="#active_card" data-toggle="tab">Активные карточки</a></li> <li><a href="#deactive" data-toggle="tab">Архив</a></li> <li><a href="#statistics" data-toggle="tab">Статистика</a></li> </ul> <div class="tab-content" id="tab_viewContent"> <div class="tab-pane active" id="active_card"> <div class="form-group"> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">Активные карточки</h3> </div> <div class="panel-body"> <div class="form-horizontal"> <div class="form-group"> <div class="col-sm-5"> </div> <div class="col-sm-1"> <button class="btn btn-primary put_notebook" type="submit" data-toggle="modal" data-target="#notebook_modal"><i class="icon-save"></i>Выдать ноутбук</button> </div> </div> .... .... .... <div id="notebook_modal" class="modal" role="dialog"> <div class="modal-dialog modal-lg"> <div class="modal-content"> </div> </div> </div>

  • Without the code is difficult to understand. - labris
  • added ........ - Roma Kosyachenko
  • problems should not be an example . Create a minimal, self-contained and reproducible example . - Alex
  • I have modal dynamic and it is processed through $(".put_notebook").click(function () { console.log("add_event"); //var split_class=$(this).attr("class").split(' ')[0]; var url = "modal/"; $(".modal-content").load(url) }); . And if the static as in the example, everything works. but I need a speaker. - Roma Kosyachenko

0