5

JQuery Dialogは、最近私に多くの苦痛を与えています。ポップアップしたい次のdivがあります。（クラスが構文に二重引用符を表示しないことを無視してください）

TABLE class=widget-title-table border=0 cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
    <TD class=widget-title><SPAN class=widget-title>Basic Info</SPAN></TD>
    <TD class=widget-action>
    <DIV id=edit-actions jQuery1266325647362="3">
        <UL class="linkbutton-menu read-mode">
            <LI class="control-actions">
                <A id="action-button" class="mouse-over-pointer linkbutton">Delete this                 stakeholder</A> 
            <DIV id="confirmation" class="confirmation-dialog title=Confirmation">
                Are you sure you want to delete this stakeholder? 
            </DIV>

</LI></UL></DIV></TD></TR></TBODY></TABLE>

このためのJQueryは...

$(document).ready(function() {

$('#confirmation').dialog({
    bgiframe: true, modal: true, autoOpen: false, closeOnEscape: false,
    draggable: true, position: 'center', resizable: false, width: 400, height: 150
    });

});

そして、ダイアログはによって「開かれます」

var confirmationBox = $('#confirmation',actionContent);
if (confirmationBox.length > 0) {


    //Confirmation Needed
    $(confirmationBox).dialog('option', 'buttons', {
        'No': function() {
            $(this).dialog('close');
        },
        'Yes': function() {
            $('ul.read-mode').hide();
            $.post(requestUrl, {}, ActionCallback(context[0], renderFormUrl), 'json');
            $(this).dialog('close');
        }            
    });

    $(confirmationBox).dialog('open');

}

問題は初期化自体から始まります。ドキュメントが読み込ま<div #confirmation>れると、マークアップから削除されます。以前に同様の問題が発生しましたが、ここではその解決策を使用できません。このページでは、複数のポップアップdivを使用できます。

開く直前に初期化を追加したとき。フォームがポップアップしました。しかし、閉じた後、divは削除されます。そのため、ポップアップを再度表示することはできません。

4

5 に答える 5

5

#confirmationが削除されているのが見える理由は、＃fooが$("#foo").dialog()DOM内のどこからでも、最初は非表示になっているダイアログスタイルを作成するラッパー要素内のドキュメントの下部に移動するためです。ダイアログは開くまで非表示になっていることがわかります。

于 2010-02-16T13:34:18.377 に答える
3

わかった。私はあなたたちの助けを借りてそれを釘付けにしたと思います。

私が今知っているダイアログに関するいくつかの「自己定義」の事実（私が間違っている場合は訂正してください）：

  1. a<div>がダイアログとして初期化されると、元の場所から削除され、の<body>要素に移動され<div class="ui-dialog">ます。したがって、「自然に」消えます。

  2. ダイアログを選択するには、一意の識別子が必要です。ほとんどの場合、IDにすることも、そのdivのその他の属性にして、ページ上で一意にすることもできます。

  3. ダイアログマークアップは、ダイアログが初期化されるたびに作成されます。したがって、AJAX呼び出しの場合、既存のダイアログが開始されると、ポップアップが複数回表示されます（再初期化された回数だけ）。これを解決するために、再初期化する前に既存のダイアログマークアップを削除しました。私のAJAX応答には、開始する必要のあるダイアログがいくつかある可能性があるため、これを行う必要がありました。

    function InitializeConfirmationDialog() {
    $('div.confirmation-dialog').each(function() {
    var id = $(this).attr("id");
    if ($('div.ui-dialog-content[id="' + id + '"]').length > 0) {
        $('div.ui-dialog-content[id="' + id + '"]').parents('div.ui-dialog:first').html("").remove();                
    }
    $(this).dialog({
        bgiframe: true, modal: true, autoOpen: false, closeOnEscape: false,
        draggable: true, position: 'center', resizable: false, width: 400, height: 150
    });


});

    }

于 2010-02-16T13:51:16.480 に答える
3

私の場合、単純な「falseを返す;」クリック機能でトリックを行いました：

  $("#buttonIdThatOpensTheDialogWhenClicked")
         .button()
         .click(function () {
                $("#myDialog").dialog("open");
                return false;
         });
  });
于 2013-09-20T23:56:06.507 に答える
0

たった1つのdivがid「確認」を持っていることを確認しますか？重複するIDは許可されていません。

于 2010-02-16T12:59:26.437 に答える
0

承認された答えは私にも役立ちました。私が使用していたもの：

$('.myLink').click(function(){
    $(this).next().dialog(...)
});

初めてクリックした後はそこにありませんでした。

今私はIDを直接使用しています：

$("#myId").dialog(...)

そして明らかに、ダイアログがページ上のどこに移動しても、これはそれを見つけます。

于 2012-07-12T18:18:01.853 に答える