模式对话框内的Ajax调用

Question

<script>
$(function() {

$('#clickMe').click(function(event) {
var mytext = $('#myText').val();


$('<div id="dialog"></div>').appendTo('body');            
    event.preventDefault();


            $("#dialog").dialog({                                   
                    width: 600,
                    height:300,
                    modal: true,
                    close: function(event, ui) {
                            $("#dialog").remove();
                            }
                    });
}); //close click
});

How can I implement an ajax call inside the modal dialog?

Answer 1

The modal dialog is nothing but a DIV/HTML element on your page .

Its hidden by default and when the user click on a button the modal is called and it shows up on top of the page .

You can add ajax to it the normal way

For Example

<div id="dialog">
   <a id="click" href="#">click me</a>
   <span id="after_ajax"></span>
</div>

--

$('#click').live('click', function(){
 $.post('',function(data){
   $('#after_ajax').html(data);
 });

});

Note I am binding the #click to a live event because I can see that you are adding the #dialog dynamically via jQuery .