jquery 모달 대화 상자가 팝업되지 않습니다

Question

내 앱이 작업을 완료하는 동안 나타나는 팝업 div를 만들려고합니다. 아약스 작업이 완료되면 팝업을 제거하고 싶습니다. http://jqueryui.com/demos/dialog/#modal을 검토 한 결과 유사한 솔루션을 구현하려고 시도했습니다. 하지만 내 div가 팝업으로 얻을 수 없습니다. 여기 사업부 만들 내 코드의 다음을 얻을하지 않습니다

$(document).ready(function(){ 
$('#progress-indicator').hide(); 
}); 


$('#saveData').live('click', function() { 
//$('#progress-indicator').show(); 
    $("#progress-indicator").dialog({ 
    height: 140, 
    modal: true 
}); 
}); 

불행하게도 : 페이지에 나중에 다음

<div id="progress-indicator"> 
    <img src="<?php echo base_url();?>assets/img/wip.gif" /> Please Wait... 
</div> 

을, 나는 누군가가 버튼을 클릭 할 때까지 사업부를 숨길 수있는 몇 가지 자바 스크립트를 저장 버튼을 클릭하면 팝업됩니다. 내가 잘못한 곳을 말해 준다면 고맙겠습니다.

감사합니다.

편집 :
팝 업 div를 만들기 전에 기존 페이지에서 div를 볼 수있는 행이 있었기 때문에 버튼 클릭 이벤트가 발생합니다. 그리고 그것은 작동합니다. 예를 들어 다음 코드가 작동합니다.

$(document).ready(function(){ 
$('#progress-indicator').hide(); 
}); 

$('#save').live('click', function() { 
$('#progress-indicator').show(); 
}); 

이 코드는 페이지의 가운데에 팝업이 나타나기를 원하는 경우를 제외하고는 정상적으로 작동합니다.

편집 2 : 그런데 녀석들도 파이어 폭스에서 웹 개발자 콘솔을 확인했는데 오류 메시지가 표시되지 않습니다. 나는 JQuery와 및 JQuery와 - UI를 모두 포함하고 또한 ... 도움 경우 :

<script src="assets/js/jquery-1.8.1.min.js" charset="utf-8"></script> 
<script src="assets/js/jquery-ui-1.8.23.custom.min.js"></script> 

Answer 1

당신은 너무 빨리 문서가 준비 닫는 것입니다. 라이브 또는 켜기와 클릭의 바인딩은 문서 내에 있어야합니다. 이제 문서 준비가 첫 번째 숨기기 직후에 끝납니다. 이렇게하면 click 이벤트가 바인드 될 때 대화 상자 함수가 아직로드되지 않을 가능성이 있습니다.

Answer 2

이 대화 상자

<div id="progress-indicator" style="display:none;"> 
<img src="<?php echo base_url();?>assets/img/wip.gif" /> Please Wait... 
</div> 

(function ($) { 
$('#saveData').click(function() { 
$("#progress-indicator").dialog({ 
    height: 140, 
    modal: true 
    }); 
    }); 
})(jQuery); 

Answer 3

를 나타납니다 당신은 클릭() 이벤트 전에 대화 상자를 정의해야합니다. 클릭 내에서 open()을 호출해야합니다.

$(document).ready(function(){ 
$("#progress-indicator").dialog({ 
    height: 140, 
    modal: true 
    }); 
$('#progress-indicator').hide(); 

$('#save').click(function() { 
$('#progress-indicator').dialog('open'); 
}); 
});