Jquery 대화 상자 - DOM에 여러 번 추가 된 대화 상자 필드

Question

Jquery UI를 사용하여 탭을 표시하고 있습니다. 탭 중 하나에서 대화 상자가 있습니다. 해당 탭으로 이동하여 대화 상자를 열고 닫은 다음 탭에서 다시 탐색하여 대화 상자를 열면 DOM에 여러 HTML 요소가 중복됩니다. 즉

은 ...

나는 탭 내 주요 페이지 설정을 가지고 :

<div id="dgEvent"> 
    <input id="someId"> 
</div> 

... 

$("#dgEvent").dialog(); 

나는했습니다 :

는

<div id="groupTabs" style="width:600px; height:600px; display:none"> 
    <ul> 
     <li><a href="tab1.aspx"><span>Info</span></a></li> 
     <li><a href="tab2.aspx"><span>Associations</span></a></li> 
    </ul> 
</div> 

탭 # 2는 대화 상자가 들어 대화 상자를 열면 다른 탭으로 이동 한 다음 다시 돌아와서 다음 번에 대화 상자를 열면 DOM에서 "someId"라는 이름의 중복 요소로 끝날 것입니다. 이것은 someID (즉, # someID) .val()에서 값을 가져 오려고하면 대화 상자의 첫 번째 인스턴스에서 값을 가져 오기 때문에 문제가 발생합니다.

대화 상자가 닫힐 때 필드가 제거되었는지 확인하십시오. 또는 다른 탭으로 이동할 때 탭이 제대로 제거되었는지 여부

결국 편집

, 나는 문제가 함께 탭 및 대화 상자의 사용과 관련이있다 생각합니다. 대화 상자 외부에있는 양식의 모든 필드는 탭에서 이동할 때 DOM에서 제거됩니다. 그러나 대화 상자에 있던 내용은 DOM을 탐색 한 후에 DOM에 남아 있습니다. 따라서, 내가 뒤로 돌아갈 때, 나는 중복으로 끝난다. 대신 $("#dgEvent").dialog();의

Answer 1

은 숨길 수는 없습니다 자동 연 다음/보여 개폐 사용할 않도록 대화 상자를 만들어 대화 시도 :의 jQuery UI Dialog page의 개요 부분을 참조하십시오

$("#dgEvent").dialog({ autoOpen: false }); 
$("#dgEvent").dialog('open'); 
$("#dgEvent").dialog('close'); 

을하는 참고 문헌 번호 this blog post.

Answer 2

나는 비슷한 경험을했다.
내 문제는 updatepanel 안에 팝업 <div>이있는 것으로 인해 발생했습니다.
ajax 호출 후 새 복제본이 만들어집니다.
이 문제를 해결하려면 <div>을 updatepanel 안에 넣지 마십시오.
대신 updatepanel을 <div> 팝업 안에 넣으십시오.
희망이 있습니다.

Answer 3

이 대화는 대화가 당신의 문제를 해결해야

$("#dgEvent").remove(); 

DOM을

에서 제거하려고 닫기 전에 jQuery를 UI에 의해 복제 및 DOM, 의 끝에 배치되고있는 것으로 보인다.

Answer 4

사용

$('#your-dialog').dialog('destroy').remove(); 

대화 상자를 파괴하고 remove()와 DOM에서 아이들의와 다음 DIV를 제거합니다.

감사합니다.