Problème d'avoir une boîte de dialogue modale pour ouvrir une boîte de dialogue secondaire
-
09-06-2019 - |
Question
J'ai un formulaire de dialogue modal
contenant des "liens d'aide". qui doit ouvrir d’autres panneaux ou boîtes de dialogue non modaux (tout en conservant la boîte de dialogue principale autrement modale).
Cependant, ceux-ci se retrouvent toujours derrière le masque. YUI
semble reconnaître le z-index
le plus élevé et définir le masque et le dialogue modal pour qu'ils soient plus hauts que cela.
Si j’attends de paramétrer le contenu de l’aide en panneau, je peux alors les configurer pour qu’ils aient un indice z supérieur. Jusqu'ici tout va bien. Le problème est alors que les champs dans les dialogues secondaires non modaux sont non focalisables. La boîte de dialogue modale située en dessous semble empêcher d’une manière ou d’une autre l’attention de se concentrer sur autre chose que la boîte de dialogue modale initiale.
Cela serait également acceptable si je pouvais effectuer cette "modalité de groupe de dialogue". avec jQuery, si YUI ne le permet tout simplement pas.
Aide!
La solution
Par défaut, YUI gère l'index z de tout élément qui étend YAHOO.widget.Overlay et utilise un panneau de superposition. Cela se fait par le biais de l'option "bringToTop" de YAHOO.widget.Overlay. méthode. Vous pouvez désactiver cette option en modifiant simplement l'option "bringToTop". méthode pour être une fonction vide:
YAHOO.widget.Overlay.prototype.bringToTop = function() { };
Ce code l'éteindrait pour de bon et vous pouvez simplement le mettre au bas du fichier container.js. Je trouve cette approche un peu trop comme une approche au marteau, alors nous étendons les classes YUI et après avoir appelé "super.constuctor" écrire:
this.bringToTop = function() { };
Si vous faites cela, vous dites essentiellement à YUI que vous allez gérer vous-même les indices z de vos éléments. C’est probablement bien, mais il convient de réfléchir à quelque chose avant de le faire.
Autres conseils
Le dialogue d'origine ne peut pas être modal si l'utilisateur est supposé interagir avec d'autres éléments - c'est la définition de modal. Le dialogue original vraiment doit-il être modal? Si tel est le cas, avez-vous essayé de basculer la propriété modale de la boîte de dialogue d'origine avant d'ouvrir les autres éléments?