Microsoft Edge "Leave Site" 从下拉列表中选择时显示消息

Question

我有一个使用 Razor 的继承 MVC5 Web 应用程序，当页面加载时，会显示两个下拉列表、一些数据和五个按钮，其中一个被禁用（保存）。当我 select 与第一个下拉菜单不同的选项时，应该会显示带有日期选择器的输入字段，以及“确定”按钮和“保存”按钮启用。这在 IE 11 中运行良好，但在 Microsoft Edge 中，会出现一条消息，询问“离开网站？您所做的更改可能无法保存。”如果我单击“离开”按钮，微调器会出现，我会留在页面上。

在 IE 11 中，当从第一个下拉列表中 select 编辑任何其他选项时，会出现微调器，页面会重新加载带有日期选择器的输入字段，但会出现“确定”按钮，并且“保存”按钮是启用。唯一一次显示类似消息是在单击后退按钮时。

我检查了代码并发现了以下内容：

第一个下拉代码：

@Html.DropDownListFor(m => m.StatusId, new SelectList(Model.StatusList, "Value", "Text", Model.StatusId), new { @class = "form-control", @id = "StatusList"})

我还发现了一个隐藏的提交按钮：

@Html.HiddenFor(m => m.CurrentTypeName, htmlAttributes: new { id = "CurrentTypeName" })
<input id="FinalizeValidationButton" type="submit" name="action:FinalizeValidation" style="visibility:hidden" />

在 javascript 文件中，我发现了以下内容：

//This is the first dropdown mentioned above
 $('#StatusList').change(
function () {
    triggerFinalizeValidation();
    setVisibility();
});

var triggerFinalizeValidation = function () {
var selectedStatus = $('#StatusList').val();
$("#CurrentSignificantActivityTypeName").val($("div.active").prop("id"));
if (selectedStatus != 1) {
    navParams.userAction = true;
    $('#finalizeButton').prop('disabled', true);
    navParams.isDirty = false;
    $('#FinalizeValidationButton').trigger('click');
}};

所以发生的事情是，用户 select 与第一个下拉列表 (StatusList) 不同，它触发 $('#StatusList').change，后者又调用 triggerFinalizeValidation()，它在turn 将点击事件添加到隐藏的提交按钮（“FinalizeValidationButton”）。无论出于何种原因，它都会触发类似回发的响应，这会导致 Microsoft Edge 认为用户正在尝试离开当前页面，而实际上他们并没有。

隐藏按钮，点击后，执行RiskController.ca中的以下代码。除了已经提到的 fields/buttons 之外，屏幕上还有许多下拉菜单、字段等。因此，这部分代码会验证用户 selected 的内容，并根据 selected 的内容进行计算。当我在 JavaScript 中注释掉点击事件时，浏览器消息不显示，但 FinalizeValidation 方法也不执行。

    [AcceptVerbs(HttpVerbs.Post)]
    [MultiButtonAction(Name = "action", Argument = "FinalizeValidation")]
    public ActionResult FinalizeValidation(RiskViewModel viewModel)
    {
        string currentActivityTypeName = viewModel.CurrentActivityTypeName;
        var risk = _riskRepository.FindFull(viewModel.Id);

我想知道是否有一种方法可以在下拉列表中使用 @onchange 以某种方式调用控制器中的 FinalizeValidation 方法，看看是否可以解决浏览器消息的出现...想法？

Answer 1

我最终使用了

$(window).off('beforeunload');

之后

$('#FinalizeValidationButton').trigger('click');

解决了问题。

Microsoft Edge "Leave Site" 从下拉列表中选择时显示消息

Microsoft Edge "Leave Site" Message Displays when Choosing from Dropdown

visual-studio

razor

microsoft-edge