Matérialiser Modal + filepicker Modal - Conflict

Question

Donc j'utilise ce qui suit pour charger un template dans un modal (quelque chose).

Template.something.onRendered(function(){ 
    this.$(".modal-trigger").leanModal(); 
}); 

Le modèle a un bouton dans ce qui, une fois cliqué appelle le filepicker en utilisant le code suivant écrit dans les événements modèles

'click #upload': function() { 

     event.preventDefault(); 
     filepicker.pickAndStore(
      { 
       mimetypes: ['image/png'], 
       multiple: false 
      }, 
      { 
       access: "public" 
      }, 
      function (InkBlobs) { 
       var InkBlob = _.first(InkBlobs); 
       var FilepickerId = _.last(InkBlob.url.split("/")); 

      }, 
      function (FPError) { 
       if (FPError && FPError.code !== 101) 
        alert(FPError.toString()); 
      } 
     ); 
    }, 

Le problème que j'ai est la charge modale FilePicker sous le « quelque chose » modal. Pour cette raison, non seulement je ne peux pas accéder au template de fichierpicker, mais si je tente même de cliquer n'importe où en dehors de mon modal "quelque chose", le modal se fermera.

Idéalement, je voudrais filepicker pour pop-up, télécharger l'image, fermez-le, faites les choses dont j'ai besoin dans le modal "quelque chose" et fermez-le en cliquant en dehors du modal.

Un moyen d'éviter le conflit entre les deux modaux?

Answer 1

Là, vous avez besoin vous est d'ajuster le z-index des modaux:

https://developer.mozilla.org/en-US/docs/Web/CSS/z-index