jquery ui 대화 상자 : 초기화 전에 대화 상자에서 메서드를 호출 할 수 없습니다.

jquery 1.5에 대화 상자가있는 앱이 있습니다. 많은 .live 핸들러가 있지만 이것을 .on으로 변경했습니다. 이를 위해 jquery (현재 1.8.3, jquerui 1.9.1)를 업데이트해야합니다.

이제 다음을 얻었습니다. Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'

다음은 코드입니다.

자바 스크립트

var opt = {
        autoOpen: false,
        modal: true,
        width: 550,
        height:650,
        title: 'Details'
};

$(document).ready(function() {
$("#divDialog").dialog(opt);
    $("#divDialog").dialog("open");
...    

HTML 코드

<div id="divDialog">
<div id="divInDialog"></div>
</div>

왜 이런 일이 일어나는지 아십니까?

대신 이것을 시도하십시오

$(document).ready(function() {
  $("#divDialog").dialog(opt).dialog("open");
});

다음을 수행 할 수도 있습니다.

var theDialog = $("#divDialog").dialog(opt);
theDialog.dialog("open");

이는 대화 상자가에 저장되지 않고 $('#divDialog')즉석에서 생성되고 .dialog(opt)함수에 의해 반환되는 새 div에 저장되기 때문 입니다.

jQuery를 업그레이드 할 수없고 다음을 얻는 경우 :

Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'

다음과 같이 해결할 수 있습니다.

$(selector).closest('.ui-dialog-content').dialog('close');

또는보기를 제어하고 전체 페이지에서 다른 대화 상자가 전혀 사용되지 않아야한다는 것을 알고있는 경우 다음을 수행 할 수 있습니다.

$('.ui-dialog-content').dialog('close');

사용 closest하면 성능 문제가 발생하는 경우에만이 작업을 수행하는 것이 좋습니다 . 모든 대화 상자에서 전역 닫기를 수행하지 않고이를 해결하는 다른 방법이있을 수 있습니다.

jqueryui 라이브러리를 병렬로 업데이트하지 않고 jquery 라이브러리 만 업데이트하면이 오류가 발생합니다. jqueryui 1.9.0과 함께 jquery 1.8.3을 사용하고있었습니다. 그러나 jquery 1.8.3을 1.9.1로 업데이트하면 위의 오류가 발생했습니다. 내가 불쾌감을 주었을 때.close 메서드 줄을 찾을 수 없다는 오류가 발생했습니다..browserjquery 1.8.3에서 더 이상 사용되지 않고 jquery 1.9.1에서 제거 된 jquery 라이브러리에서. 따라서 기본적으로 jquery 1.9.1 라이브러리는 jquery ui 다운로드 페이지에서 jquery 1.6 이상에서 작동한다고 말 했음에도 불구하고 jquery ui 1.9.0 라이브러리와 호환되지 않았습니다. 기본적으로 두 버전의 다른 버전을 사용하려고 할 때보고되지 않은 버그가 있습니다. jqueryui 다운로드와 함께 제공되는 jquery 버전을 사용하는 경우 괜찮을 것이라고 확신하지만 다른 버전을 사용하기 시작하면 구타 경로에서 벗어나 이와 같은 오류가 발생합니다. 요약하면이 오류는 일치하지 않는 버전에서 발생합니다 (내 경우에는 어쨌든).

그래서 이것을 사용합니다.

var theDialog = $("#divDialog").dialog(opt);
theDialog.dialog("open");

Dialog에서 MVC Partial View를 열면 숨겨진 버튼과 JQUERY 클릭 이벤트를 색인에 만들 수 있습니다.

$("#YourButton").click(function()
{
   theDialog.dialog("open");
   OR
   theDialog.dialog("close");
});

그런 다음 부분보기 HTML 내부에서 다음과 같이 버튼 트리거 클릭을 호출합니다.

$("#YouButton").trigger("click")

안녕.

Dialog가 초기화되거나 페이지가 준비되었을 때 즉시 Dialog를 열려면 대화 상자 의 옵션 개체에서 매개 변수 autoOpen를 true로 설정할 수도 있습니다.

var opt = {
        autoOpen: true,
        modal: true,
        width: 550,
        height:650,
        title: 'Details'
};

따라서`$ ( "# divDialog"). dialog ( "open");를 호출 할 필요가 없습니다.

대화 개체가 초기화되면 대화 상자가 자동으로 열립니다.

새로운 jQuery UI 버전에서는 초기화되지 않은 대화 상자에서 UI 메서드를 호출 할 수 없습니다. 해결 방법으로 아래 확인을 사용하여 대화 상자가 활성 상태인지 확인할 수 있습니다.

if (modalDialogObj.hasClass('ui-dialog-content')) {
    // call UI methods like modalDialogObj.dialog('isOpen')
} else {
    // it is not initialized yet
}

이것은 또한 몇 가지 해결 방법입니다.

$("div[aria-describedby='divDialog'] .ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-icon-only.ui-dialog-titlebar-close").click();

단순히 ScriptManager를 페이지에 추가하기 만하면됩니다. 문제가 해결되었습니다.

제 경우 문제는 $("#divDialog").removeData();대화 상자 내에서 양식 데이터를 재설정하는 과정에서 호출 한 것입니다.

이로 인해 uiDialog대화 상자를 다시 초기화해야하는 데이터 구조 가 지워졌습니다.

나는 .removeData()더 구체적인 삭제 로 대체 했고 모든 것이 다시 작동하기 시작했습니다.

내 경우는 다르며 ' this ' 의 범위 때문에 실패합니다 .

//this fails:
$("#My-Dialog").dialog({
  ...
  close: ()=>{
    $(this).dialog("close");
  }
});

//this works:
$("#My-Dialog").dialog({
  ...
  close: function(){
    $(this).dialog("close");
  }
});

부모보기 대신 부분보기에 div 태그가 있기 때문에이 오류 메시지가 나타납니다.