在流星 js 的同一页面上打开多个物化模式

Question

id of 1st modal is "modal1" and 2nd modal id is "modal2"

HTML 代码 ->

1st Modal Call on Same Page

<div class="input-field col s12 m6 left-align">
                <button class="btn waves-effect waves-light modal-trigger importButton" style="height:45px !important">Import Data
                    <i class="material-icons right">import_export</i>
                </button>
</div>

2nd Modal Call on Same Page

<div class="modal-trigger" style="cursor: pointer;">
                <img src="abc.png" alt="" class="circle">
</div>

JS代码->

'click .modal-trigger': function(event) {
    event.preventDefault();
    $('#modal1').openModal();
},
'click .importButton':function(event) {
     event.preventDefault();
    $('#modal2').openModal();
}

Answer 1

You have to give refrence of another template {{>import}} (my template name is import) in which my modal2 is defined.

Answer 2

你的问题不是很清楚。据我了解，可以从同一个模板打开 2 个模式。这里的问题是 bootstrap does not support multiple modals 相互叠加。

Multiple open modals not supported Be sure not to open a modal while another is still visible. Showing more than one modal at a time requires custom code.

因此，在第一个模态打开之前，你必须首先检查另一个模态是否处于关闭状态，同样，在第二个模态打开之前，你必须检查第一个模态是否关闭，如果没有然后关闭它。

meteor 中有一个包似乎可以帮助处理多个模态。您可以查看 peppelg:bootstrap-3-modal 以在流星中更好地实现 bootstrap 模态。特别是他们提到使用以下的部分：

Modal.allowMultiple = true

在流星 js 的同一页面上打开多个物化模式

Open more than one materialize modal on same page in meteor js

javascript

materialize

meteor