Question

我正在使用JQuery对话框UI让用户确认页面上的操作。如果是，则进行API调用，然后窗口将重定向。如果不是，则对话框关闭。

在重定向之前，我想在实际对话框中显示“成功”消息，例如“此操作已执行”。关于如何实现这一点的任何想法？

这是我的代码：

$( "#dialog-confirm" ).dialog({
    resizable: false,
    height:140,
    modal: true,
    buttons: 
    {
        "Yes": function() 
        {


                    var request = '123';
            var url = '<?= $this->baseURL; ?>?rn=' + request;
                $.getJSON(url, function(data) {});  
            }


            var msg = 'Action performed';

                    //?   How do I display this message in the modal dialog window???

                    $( this ).dialog( "close" );
            var url = '<?= $this->moduleURL; ?>/cancel';        
            window.location.href = url; 


        },

        "Nevermind": function() {
                $( this ).dialog( "close" );
        }
    }
});

Answer 1

这可能是一种方法，你清空对话框div并附加新文本并设置一个时间，3秒后，diloge关闭并重定向发生

$( "#dialog-confirm" ).dialog({
resizable: false,
height:140,
modal: true,
buttons: 
{
    "Yes": function() 
    {


                var request = '123';
        var url = '<?= $this->baseURL; ?>?rn=' + request;
            $.getJSON(url, function(data) {});  
        }


        var msg = 'Action performed';

        $( "#dialog-confirm" ).empty();

        $( "#dialog-confirm" ).text(msg);


 setTimeout(function() {
     $( this ).dialog( "close" );
       var url = '<?= $this->moduleURL; ?>/cancel';        
        window.location.href = url; 
}, 3000);



    },

    "Nevermind": function() {
            $( this ).dialog( "close" );
    }
}
});

Answer 2

使用AJAX方法，并将async设置为false。这将确保在继续重定向之前已返回请求。

要设置对话框内容，您只需使用.html()。

$("#dialog-confirm").dialog({
    resizable: false,
    height: 140,
    modal: true,
    buttons: {
        "Yes": function () {
            var request = '123';
            var url = '<?= $this->baseURL; ?>?rn=' + request;
            var msg = 'Action performed';
            $("#dialog-confirm").html(msg);

            $.ajax({
                dataType: "json",
                url: url,
                async: false,
                success: function (data) {
                    $("#dialog-confirm").dialog("close");
                    var url = '<?= $this->moduleURL; ?>/cancel';
                    window.location.href = url;
                }
            });
        },
        "Nevermind": function () {
            $(this).dialog("close");
        }
    }
});

JQuery对话框：选择确认选项后在对话框中显示消息

2 个答案: