Bootstrap Modal закрыть кнопку проблема

Question

Я работаю над bootstrap модальным, когда модальный открыт, у него есть две кнопки для печати модального контента, вторая для закрытия модального.

код модальной в ASPX странице:

<div class="modal fade" id="myModal" role="dialog"> 
    <div class="modal-dialog modal-lg"> 
     <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">&times;</button> 
      <h4 class="modal-title">PD checks details</h4> 
     </div> 
     <div id="printArea" class="modal-body"> 
      <asp:Repeater ID="rptPDC" runat="server"> 
       <HeaderTemplate> 
        <table class="table table-bordered table-condensed table-hover table-responsive table-striped"> 
         <tr> 
          <th>IDVC</th> 
          <th>Check Number</th> 
          <th>Check Date</th> 
          <th>AMTRMITHC</th> 
         </tr> 
       </HeaderTemplate> 
       <ItemTemplate> 
        <tr> 
         <td><%#Eval("idvc") %> </td> 
         <td><%#Eval("checkNo") %> </td> 
         <td><%#Eval("checkDa") %> </td> 
         <td><%#Eval("art") %> </td> 
        </tr> 


       </ItemTemplate> 
       <FooterTemplate> 

        </table> 
       </FooterTemplate> 

      </asp:Repeater> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" onclick="PrintElem('printArea')">Print</button> 
<button type="button" id="closemodal" class="btn btn-default" data-dismiss="modal">Close</button> 

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

проблема, когда нажатие кнопки печати пользователь каждая вещь в порядке и модальное содержание будет распечатан, но когда пользователь нажимает на кнопку закрытия, чтобы закрыть модальное после печати содержимого ничего не происходит, модальный не закрыт?

я пытался использовать следующий код яваскрипта спрятали модальность:

$("#closemodal").click(function() { 
      $("#myModal").modal("hide"); 
     }); 

, но и ничего с той же проблемой до сих пор?

Answer 1

Вам не нужно привязывать событие к закрытию явно. Он встроен в bootstrap. Посмотрите на пример кода внимательно на http://getbootstrap.com/javascript/#modals

Answer 2

его работы с кодом

<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
      Launch demo modal 
     </button> 

<div class="modal fade" id="myModal" role="dialog"> 
    <div class="modal-dialog modal-lg"> 
     <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">&times;</button> 
      <h4 class="modal-title">PD checks details</h4> 
     </div> 
     <div id="printArea" class="modal-body"> 
      <asp:Repeater ID="rptPDC" runat="server"> 
       <HeaderTemplate> 
        <table class="table table-bordered table-condensed table-hover table-responsive table-striped"> 
         <tr> 
          <th>IDVC</th> 
          <th>Check Number</th> 
          <th>Check Date</th> 
          <th>AMTRMITHC</th> 
         </tr> 
       </HeaderTemplate> 
       <ItemTemplate> 
        <tr> 
         <td><%#Eval("idvc") %> </td> 
         <td><%#Eval("checkNo") %> </td> 
         <td><%#Eval("checkDa") %> </td> 
         <td><%#Eval("art") %> </td> 
        </tr> 


       </ItemTemplate> 
       <FooterTemplate> 

        </table> 
       </FooterTemplate> 

      </asp:Repeater> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" onclick="PrintElem('printArea')">Print</button> 
<button type="button" id="closemodal" class="btn btn-default" data-dismiss="modal">Close</button> 

     </div> 
     </div> 

https://jsfiddle.net/m1tL84gw/

Answer 3

самозагрузки находит элемент с атрибутом данных Отклонить = «модальными» и запуска нажать на него close modal dialog

<button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 

Answer 4

Попробуйте получить console.log ('test'), когда yo u нажимает кнопку модального закрытия, если вы ее получите, то вы можете вызвать кнопку закрытия модального закрытия. Например: $("#closemodal").click(function() { console.log('MOdal CLose Layer'); setTimeout(function(){$("#myModal").modal("hide");},1000); });

Answer 5

Вы также можете проверить это Demohttp://jsfiddle.net/h3WDq/. Закрытие модальной обработки осуществляется самим бутстрапом. Или просто дважды проверьте свой код функции PrintElem ('printArea'). Возможно, что что-то внутри функции нарушает тесную функциональность модального.

Update: Используйте ниже сценария для печати, и он будет работать:

<script> 
    function PrintElem(elem) { 
    var toPrint; 
    toPrint=window.open(); 
    toPrint.document.write(document.getElementById(elem).innerHTML); 
    toPrint.print(); 
    toPrint.close(); 
    } 
</script>