2

JQueryUIダイアログウィジェットを使用してページにポップアップ画面を表示したい。

これを実装するため<div class="popup-placeholder">に、私は自分のページにを持っています。実際には、ページに複数あります（これがソリューションに違いをもたらす場合）

ボタンをクリックすると、ダイアログを初期化して「開く」ことになります。ポップアップのコンテンツを取得するためにAjax呼び出しを行うことになっているため、ポップアップの初期化はアクションクリック内で行われます。（クリックイベントから初期化を取り除こうとしましたが、機能しませんでした$('div.popup-placeholder').dialog();）

    var popupContext = $('#' + contextControl.id + ' > .popup-placeholder');
    popupContext.html(formHtml);

    $(popupContext).dialog({
        bgiframe: true,
        modal: true,
        autoOpen: false,
        closeOnEscape: false,
        dialogClass: '',
        draggable: true,
        position: 'center',
        resizable: false,                                    
        width: 600
    });

アクションボタンをクリックすると、フォームが表示され、想定どおりに実行されます。これで、ポップアップに「ダイアログボタンではない」という近いリンクが表示されますが、イベントがバインドされた別のリンクが表示されます。これを行います...

$('#popup-placeholder-61').dialog('close');

ここで、＃popup-placeholder-61は$（popupContext）と同じです

私が今直面している問題は、ポップアップを閉じるときに、同じアクションボタンがポップアップを再び表示しないことです。問題は<div class="popup-placeholder">、マークアップからが削除されたことにあるようです。

次のページで解決策を試しましたが、役に立ちませんでした -StackOverflowでJqueryダイアログを閉じる

だから、私はもっと助けが必要です

4

4 に答える 4

2

少し苦労した後、私は最良の解決策を思いついた。dialog（'close'）の代わりに以下の行を使用してください

$('#popup-placeholder-61').dialog("destroy");

これにより、divはその位置を保持できます

于 2015-07-09T02:45:58.540 に答える
1

私の問題は解決しましたが、以前のアプローチが機能しなかった理由を調査します。以前に行っていたのは、IDが異なる複数のプレースホルダーがあり、そのうちの1つだけをダイアログにしたことです。いくつかのJqueryセレクターを使用して、ダイアログボックスに適切なdivを選択しましたが、上記のような問題がありました。

私が今行った唯一の変更は、プレースホルダーとして機能する単一のdivがあることです。そして、それは今うまくいきます。また、イベント外でも正常に初期化されました。それで、多分それは私のセレクターと関係がありましたか？私はもっ​​と試してみます、そして私が何かを見つけたらフォローアップとしてそれを投稿します。

ありがとう。

于 2010-02-12T12:02:10.427 に答える
0

クリックイベントから初期化コードを取り出してみてください。すべてを再バインドしようとすると、2回目のクリックでダイアログを開くことができない可能性があります...同様の問題があり、マークアップを作成して「解決」しました。ダイアログを開くたびにダイアログが表示されます。

問題のajaxビットは、クリックイベントから初期化を取り除くために抑制されていません。クリックイベントにajaxコンテンツをロードし、dialog（'open'）でダイアログを表示するだけです。

于 2010-02-12T10:58:34.410 に答える
0

主な問題は、間違った場所でダイアログdivを探していたということでした。

詳細については、この投稿を参照してください...

Jqueryダイアログ-divは初期化後に消えます

于 2010-02-16T15:45:00.427 に答える