0

I wanna close a jquery modal dialog with a button that is within a form inside the modal...

$("#btnCancel").button().on('click', function (event) {
    event.preventDefault();
    $("#modalDlgWindow").dialog("close");
});

function loadDialog(tag, event, target) {
    event.preventDefault();
    event.stopPropagation();
    var $loading = $('<img src="../../Content/assets/images/nivo-loader.gif" alt="loading" class="ui-loading-icon">');
    var $url = $(tag).attr('href');
    var $title = $(tag).attr('title');
    $("#modalDlgWindow").empty();
    $("#modalDlgWindow")
        .append($loading)
        .load($url)
        .dialog({
            autoOpen: false
            , resizable: false
            , autoResize: true
            , title: $title
            , width: 'auto'
            , modal: false
            , height: 'auto'
            , show: 'fade'
            , position: [10, 50]
            , hide: 'fade'
        });
    $("#modalDlgWindow").dialog('open');
};

It works with .fadeOut(500) and .empty() and so I thought that it would also work with .dialog('close') but it doesn't. Does anyone have a solution to my problem please?

4

1 回答 1

1

请参阅此处:如何在对话框中关闭 jQuery 对话框?

尝试:

 $("#modalDlgWindow").closest('.ui-dialog-content').dialog('close'); 

或者,您可以像这样添加取消(和提交)按钮:

function loadDialog(tag, event, target) {
    event.preventDefault();
    event.stopPropagation();
    var $loading = $('<img src="../../Content/assets/images/nivo-loader.gif" alt="loading" class="ui-loading-icon">');
    var $url = $(tag).attr('href');
    var $title = $(tag).attr('title');
    $("#modalDlgWindow").empty();
    $("#modalDlgWindow")
        .append($loading)
        .load($url)
        .dialog({
            autoOpen: false
            , resizable: false
            , autoResize: true
            , title: $title
            , width: 'auto'
            , modal: false
            , height: 'auto'
            , show: 'fade'
            , position: [10, 50]
            , hide: 'fade'
        });

        $("#modalDlgWindow").dialog("option", "buttons", {
                "Submit": function () {
                       // Get form values here

                       $.ajax({
                              type: 'POST',
                              //post form information here,
                              success: function (msg) {
                              if (msg.d) {
                                 $(this).dialog("close");                                    
                                }
                              },
                              error: function () {
                                 alert("Error! Try again...");
                              }
                       });
                    },
              "Cancel": function () {
                     $(this).dialog("close");
               }
            );
    $("#modalDlgWindow").dialog('open');
};
于 2012-11-19T22:46:17.720 回答