オープンつ以上の流星のjs

Question

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

HTMLコードで同じページにモーダルを実体 - 同じページに>

第一モーダルコール

<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> 

第2モーダルコールオン同じページ

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

JSコード - あなたが別のテンプレート{{>輸入}}（私のテンプレート 名前は輸入である）の私のmodal2のrefrenceを与えなければならない>

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

Answer 1

が定義される。

Answer 2

あなたの質問はあまり明確ではありません。私が理解していることから、同じテンプレートから開くことができる2つのモーダルがあります。ここでキャッチするのは、ブートストラップdoes not support multiple modalsがお互いに積み重なっていることです。

複数の開いたモーダルはサポートされていません がまだ表示されている間にモーダルを開いてはいけません。一度に複数のモーダルを表示する にはカスタムコードが必要です。

したがって、最初のモーダルが開く前に、最初に他のモーダルが閉じた状態であるかどうかをチェックし、同様に、2番目のモーダルが開く前にチェックしなければなりません。それを閉じないでください。

流星には、複数のモーダルを扱うのに役立つパッケージが1つあります。あなたは流星のブートストラップモーダルのより良い実装を得るためにpeppelg:bootstrap-3-modalをチェックアウトすることができます。具体的には、以下の使用について言及する部分：

Modal.allowMultiple = true