对话框内的 Ajax 调用，对话框关闭不起作用

Question

我对 jQuery 和 Javascript 还很陌生。我的问题是 jQuery UI 对话框。我有一个表格，我在其中单击一行并将更多详细信息填充到对话框中。对话框将在其中包含一个表单和一个表格。当用户输入详细信息并单击表单时，我会检查用户输入并将表单再次显示回对话框中，但是当发生这种情况时，对话框关闭按钮不起作用。

有人可以建议如何解决这个问题吗？谢谢你的帮助。

$.ajax({
    type:"POST",
    dataType:"html",
    url:"form/add/"+estimateId,
    cache:false,
    //data:a,
    success:function(html){
        //alert(html);
        $(".projectMaintenance").html(html);
        $(".projectMaintenance").dialog({
            resizable:false,
            height:750,
            width:900,
            modal:true,
            buttons:{
                "Close":function(){
                    $(this).dialog('destroy');
    ....

这是我用来在对话框中提交表单的脚本。

var a=$('form').serialize();

$.ajax({
    type:"POST",
    dataType:"html",
    url:"form/save",
    cache:false,
    data:a,
    success:function(html){
        alert(html);
        $(".projectMaintenance").html(html);
.......

Answer 1

您只需在用户选择关闭选项时执行 ajax 请求，为了保持更具可读性和友好性，创建一个 trySend() 函数

$.ajax({
        type:"POST",
        dataType:"html",
        url:"form/add/"+estimateId,
        cache:false,
        //data:a,
        success:function(html){
            //handle if everything it's ok and should show the dialog....
            $(".projectMaintenance").html(html);
            $(".projectMaintenance").dialog({
                resizable:false,
                height:750,
                width:900,
                modal:true,
                buttons:{

                    "Close":function(){


                        $(this).dialog('destroy');


                        buttons: {
                            "Close": function () {
                                $(this).dialog('close');
                                trySend();
                            }
                        }

......

还有 trySend 函数

        function trySend(){
            var a=$('form').serialize();
            $.ajax({
                type:"POST",
                dataType:"html",
                url:"form/save",
                cache:false,
                data:a,
                success:function(html){
                    alert(html);

                    $(".projectMaintenance").html(html);
                });
        }