需要从 MVC 5 中的控制器操作关闭 Jquery UI 对话框

Posted 2023-05-08

【中文标题】需要从 MVC 5 中的控制器操作关闭 Jquery UI 对话框

【英文标题】：Need to close Jquery UI dialog from controller action in MVC 5

【发布时间】：2017-05-02 17:54:38

【问题描述】：

我正在构建一个站点，我在其中调用 jquery ui 对话框中的局部视图。在局部视图中有一个“保存”按钮，可以将表单上的数据提交到数据库。目前它重定向到不同的视图。我希望它改为关闭对话框。我无法让它正确调用函数来关闭对话框。

这是我的代码：

在视图中：

<script type="text/javascript">
            $.ajaxSetup( cache: false );
            $(document).ready(function () 
                $(".diagSave").on("click", function (e) 
                    e.preventDefault();
                    $("<div></div>")
                    .dialog(
                        title: $(this).attr("data-dialog-title"),
                        modal: true,
                        width: 1000,
                        success: function () 
                        $('#diagSave').dialog('close');
                    
                    )

                    .load(this.href);
                )

            );
</script>

在控制器中：

return Json(new  success = true , JsonRequestBehavior.AllowGet);

有人可以帮忙指出我如何做到这一点吗？

【问题讨论】：

能否将保存例程移到主窗体中，以便在原始对话框定义的选项中添加保存按钮？

你在哪里添加了这个脚本？在主视图或部分视图上？

@perdido，这是我的主要观点。

@steve，除非无法从控制器关闭对话框，否则我宁愿保留所有内容。

【参考方案1】：

另一种方法是在 jquery 中处理保存点击，使用 .serialize 将表单集合发送到您的控制器，然后关闭对话框。

var formvalues = $('#yourformparentdiv form').serialize();
$.ajax(
     url: siteRoot + 'Home/YourControllerMethod',
     data: formvalues,
     async: true,
     type: "POST",
     ...

【讨论】：

我宁愿让一切保持原样，除非无法从控制器关闭对话框

【参考方案2】：

如果您需要处理关闭并从部分视图中保存，您需要在点击事件中处理关闭。

$("#partialview_savebutton").click(function(e)
    var $dlg = $(this).parents(".ui-dialog");
    //save the data
    $dlg.dialog("close");
);

您需要确保在将内容加载到对话框时绑定此方法。

我通常在我的对话框打开例程的末尾包含这个。

if(typeof initDlg == 'function') initDlg();

然后绑定我的事件处理程序并在我的部分视图中定义的 initDlg() 中配置我需要的任何验证。

【讨论】：

控制器中需要什么来触发关闭函数的执行？

控制器中没有任何内容，而是部分视图中我的答案中的第一个代码。你需要找到对话框元素，然后调用close

加载到对话框中的一些相关 html / js 会很有帮助。