顯示bootbox在模態對話框

我有這樣一個顯示bootbox在模態對話框

<div id="tenantDialog" class="modal fade" tabindex="-1" data-backdrop="static"> 
<div class="modal-dialog modal-lg"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title"> 
       <i class="fa fa-users"></i> 
       <spring:message code="label.tenant.person.title"/> 
      </h4> 
     </div> 
     <div class="modal-body"> 
      <%--We load here the persons table here to be reloaded in any moment--%> 
      <div id="personTableDiv"> 
       <c:set var="preferredCollaborators" value="${preferredCollaborators}" scope="request"/> 
       <jsp:include page="personsTable.jsp"/> 
      </div> 
     </div> 
     <div class="modal-footer"> 
     </div> 
    </div> 
</div>

模態對話框然後在personsTable.js關聯到包括網頁我要打開一個bootbox確認的邏輯。但是我的問題是，它在模式對話框中顯示的這個bootbox，所以它不是棘手的。

這裏我bootbox創作

bootbox.confirm(customText, function (confirmed) { 
    if (confirmed) { 
     var regularityDocumentsIds = []; 
     var i; 
     for (i = 0; i < selectedPersons.length; i += 1) { 
      regularityDocumentsIds.push($(selectedPersons[i]).attr("data-preferredcollaboratorid")); 
      } 
     removePersons(regularityDocumentsIds); 
    } 
});

任何想法，我能做些什麼，以顯示此bootbox在模態對話框？

來源

2015-07-02 paul

這是一個確認問題：using bootbox.confirm() within a bootstrap modal。

您有一個解決方法。在你的CSS補充一點：

.bootbox.modal {z-index: 9999 !important;}

來源

2015-07-02 14:51:02

這是行不通的，在票證中他們沒有確認這是一個問題，沒有其他方法來解決它。 – paul

@paul如果我們可以看到一個工作演示或小提琴，那將會很棒。 –

整個對話框與requireJS一起工作，我沒有看到一個簡單的方法向小夥伴展示小提琴，對不起 – paul

愚見（生產加工）的解決方案

您應該編輯bootbox，尋找回調：

dialog.one("hidden.bs.modal", function (e) { 
      // ensure we don't accidentally intercept hidden events triggered 
      // by children of the current dialog. We shouldn't anymore now BS 
      // namespaces its events; but still worth doing 
      if (e.target === this) { 
       dialog.remove(); 
      } 
});

並將其更改爲：

dialog.one("hidden.bs.modal", function (e) { 
      // ensure we don't accidentally intercept hidden events triggered 
      // by children of the current dialog. We shouldn't anymore now BS 
      // namespaces its events; but still worth doing 
      if (e.target === this) { 
       dialog.remove(); 
      } 

      // inspired by : https://github.com/makeusabrew/bootbox/issues/356#issuecomment-159208242 
      // if there is another modal, stop the event from propgating to bootstrap.js 
      // bootstrap.js uses the same event to remove the "modal-open" class from the body, and it creates an unscrolable modals 
      if ($('.modal.in').css('display') == 'block') { 
       // do not notify bootstrap about this change!! 
       e.stopPropagation(); 
      } 
     });

來源

2017-04-04 16:55:26 Wazime

顯示bootbox在模態對話框

回答

相關問題