javascript 关闭后如何在jquery中重新打开模态对话框?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16832053/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 06:09:42  来源:igfitidea点击:

how to reopen modal dialog in jquery after closing it?

javascriptjquery-uijqueryasp.net-mvc-4

提问by Shalin Jirawla

I have an Asp.Net MVC application, where in 1 View, I have a list with every record showing Edit icon. Clicking the edit icon opens a modal dialog popup to update the record .

我有一个 Asp.Net MVC 应用程序,在 1 View 中,我有一个列表,每个记录都显示“编辑”图标。单击编辑图标会打开一个模态对话框弹出窗口以更新记录。

I face problem in reopening the dialog or clicking other edit icon for popup after closing the dialog . Following is my jquery code to open the dialog :

我在关闭对话框后重新打开对话框或单击其他编辑图标以弹出窗口时遇到问题。以下是我打开对话框的 jquery 代码:

var singltym;

$(function () {

    $('#addSingleTimeDialog').dialog({
            cache: false,
            autoOpen: false,
            width: 450,
            height: 450,
            closeOnEscape: true,
            resizable: true,
            modal: true});

    $('#singletymlink').on('click', function () {
            singltym = $(this);
            var dialogDiv = $('#addSingleTimeDialog');
            var viewUrl = singltym.attr('href');
            $.ajax({
                cache: false,
                url: viewUrl,
                dataType: 'html',
                success: function (data) {
                    dialogDiv.html(data);
                    dialogDiv.dialog('open');
                }
            });
            return false;
        });
});

回答by Mirko Cianfarani

    var singltym;

    $(function () {

        $('#addSingleTimeDialog').dialog({
                cache: false,
                autoOpen: false,
                width: 450,
                height: 450,
                closeOnEscape: true,
                resizable: true,
                modal: true});

        $('#singletymlink').on('click', function () {
                singltym = $(this);
                var dialogDiv = $('#addSingleTimeDialog');
                var viewUrl = singltym.attr('href');
                $.ajax({
                    cache: false,
                    url: viewUrl,
                    dataType: 'html',
                    success: function (data) {
                        dialogDiv.html(data);
                       dialogDiv.dialog('open');

//I work in this method

//我在这个方法中工作

                  $( this ).dialog( "close" );

                }
            });
        });
});

Or

或者

$.ajax({
                    cache: false,
                    url: viewUrl,
                    dataType: 'html',
                    success: function (data) {
                        dialogDiv.html(data);
                       $("#dialogDiv").dialog("open");

                  $( this ).dialog( "close" );

                }

If $( this ).dialog( "close" );not working because not try this specific sentence??

如果$( this ).dialog( "close" );不工作,因为没有尝试这个特定的句子??

$('#addSingleTimeDialog').dialog("close");

回答by Shalin Jirawla

The above issue can be solved by including the below scripts in parent view from where the dialog popup is clicked & initiated :

上述问题可以通过在父视图中包含以下脚本来解决,从那里单击并启动对话框弹出:

<script type="text/javascript" src="../../Scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.validate.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.validate.unobtrusive.min.js"></script>

As well as insert the below scripts in child view which is the UI for modal dialog popup :

以及在子视图中插入以下脚本,这是模态对话框弹出的 UI:

<script type="text/javascript" src="../../Scripts/jquery.validate.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.validate.unobtrusive.min.js"></script>

By scripting in such way, the jquery script conflict is avoided & reopening of dialog can be swiftly done.

通过以这种方式编写脚本,可以避免 jquery 脚本冲突,并且可以快速重新打开对话框。

回答by Darin Dimitrov

You could use the openmethod:

您可以使用以下open方法:

$('#addSingleTimeDialog').dialog('open');

回答by JayKandari

Try writing $( this ).dialog( "close" );method in close function. Eg :

尝试$( this ).dialog( "close" );在关闭函数中编写方法。例如:

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

$( this ).dialog( "close" );does not destroy the dialog, instead it just closes and makes it available to be used for next time.

$( this ).dialog( "close" );不会破坏对话框,而只是关闭并使其可用于下次使用。

回答by ThatOneCloud

Came across this older question, found a simpler solution not listed here.

遇到了这个较旧的问题,找到了此处未列出的更简单的解决方案。

Add an event listener for the close event, and call destroy when the dialog is closed.

为close事件添加一个事件监听器,并在对话框关闭时调用destroy。

close: function(event, ui) {$(this).dialog("destroy");}

回答by Md. Shafiqur Rahman

My problem was solved by replacing

我的问题通过更换解决了

$(this).dialog("close");

with

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