なぜjQueryのUI 1.10 jQueryのダイアログを削除するzIndexオプション？

Question

jQuery UI（1.10）の最新バージョンでzIndexオプションを削除しました。 jQueryのウェブサイトでも確認されています。

本当に私に衝撃を与えました。

editrow()またはaddrow()を使用して編集ダイアログを開いて編集したり、内部に多数のフィールドがあり、その中にはイベントを定義するものがあります。それをクリックすると、別のjQueryダイアログが表示され、いくつかのツリービュー項目が選択されて表示されます。 jQueryのUI 1.9（付属）の下

は、あなたが（ zIndex設定jqgrid編集ダイアログのサポート）jqgrid編集ダイアログのより大きいにjQueryのダイアログの zIndexオプションを設定することができますので、jQueryのダイアログが常に上になると見て使用することができます。

jQuery UI 1.10では、zIndexを設定できないため、jQueryダイアログは常にjqgrid編集ダイアログの後ろにあります。

このようなシーンは非常に一般的だと思います。

なぜjQuery UI 1.10 jQueryダイアログを削除するzIndexオプション？複数のダイアログがあるときにz-indexの順序を制御するにはどうすればよいですか？

Answer 1

私はあなたの問題を理解していると思います。 jQuery UIダイアログのCSS z-indexは、コンテンツの上に常に表示されるほど高くありません。ここで簡単な修正があります：

/* A class used by the jQuery UI CSS framework for their dialogs. */ 
.ui-front { 
    z-index:1000000 !important; /* The default is 100. !important overrides the default. */ 
} 

Answer 2

ただ、（一緒にそれのために提出されているthe bugで）jQuery UI 1.10からの変更は、ログ読み：

は、スタック・オプションと同様のZIndexオプション

を削除し、のZIndexオプションは不要です適切な積み重ねを実施します。 z-indexはCSSで定義されています。 をフォーカスするダイアログがその親の最後の「スタッキング」要素であることを確認することで、スタッキングが制御されるようになりました。

つまり、zIndexオプションを使用して積み重ねる方法を「ハッキングする」のではなく、要素を積み重ねる必要があります。

Answer 3

"appendTo"オプションを試しましたか？あなたが必要とするもののz-インデックスを持つラッパーを動的に追加し、その要素のidを "appendTo"引数のセレクターとして使用します。

http://api.jqueryui.com/dialog/#option-appendTo

Answer 4

あなたは試したことがありますか？

$(".selector").dialog("moveToTop"); 

参照：http://api.jqueryui.com/dialog/#method-moveToTop

Answer 5

$('#element').dialog({  modal: true, 
          stack: false, 
          zIndex: 9999, 
... 

あなたはできるだけ早くあなたがダイアログをインスタンスとしてのjQueryを使用してのZIndexを適用したい場合は、次の操作を行うことができます私のため

Answer 6

を働いた：

$('#element').dialog({ your options... }).parent('.ui-dialog').css('zIndex',9999);