jQuery 대화 상자 - 초기화 후 DIV가 사라집니다

StackOverflow https://stackoverflow.com/questions/2272961

문제

jQuery 대화는 최근에 많은 고통을주고 있습니다. 나는 팝업되고 싶은 다음 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
    });

});

그리고 대화 상자는 'Open'입니다 

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가 제거됩니다. 그래서 팝업을 다시 볼 수 없습니다.

도움이 되었습니까?

해결책 2

괜찮아. 나는 너희들의 도움으로 그것을 못 박았다고 생각한다.

내가 지금 알고있는 대화에 대한 "자체 정의 된"사실 (내가 틀린 경우 수정하십시오) :

  1. A. <div> 대화 상자로 초기화되며 원래 위치에서 제거되어 <body> a의 요소 <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
    });


});

    }

다른 팁

당신이보고있는 이유는 #confirmation을 제거하기 때문입니다 $("#foo").dialog() #FOO는 DOM의 어디에서나 래퍼 요소 내부의 문서 하단으로 이동하여 처음에는 숨겨져있는 대화 상자 스타일을 만듭니다. 대화가 열릴 때까지 숨겨져 있음을 이해합니다.

제 경우에는 간단한 '반환 거짓'; 클릭 함수에서 트릭을 수행했습니다.

  $("#buttonIdThatOpensTheDialogWhenClicked")
         .button()
         .click(function () {
                $("#myDialog").dialog("open");
                return false;
         });
  });

하나의 Div만이 "확인"을 가지고 있다고 확신하십니까? 중복 ID는 허용되지 않습니다.

승인 된 답변도 저에게도 효과가있었습니다. 나는 사용하고 있었다 :

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

그리고 처음으로 클릭 한 후에는 없었습니다.

이제 ID를 사용하고 있습니다.

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

그리고 분명히, 대화 상자가 페이지에서 어디에서 움직이든 상관없이 이것은 그것을 찾을 수 있습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top