Question

我有一个Intranet ASP.NET应用程序，有时响应很慢。我的要求是防止双重提交，并且理想情况下向用户提供表单已经提交的反馈。

我发现的示例显示了如何禁用提交按钮，但这还不够，因为在我的应用程序中提交可能会发生：

从提交按钮。
使用AutoPostBack = true（使用javascript AFAIK提交）的任何控件。
来自UpdatePanel中的上述任何一个 - 在我理解的情况下，POST是使用AJAX完成的，我需要在AJAX调用完成时重新启用。

我正在考虑显示叠加/模态弹出窗口，可能带有动画进度图像，在提交时会显示。对于UpdatePanel，在AJAX调用完成时隐藏。

是否有人可以像上面那样轻松集成到ASP.NET页面中？或者指出我需要挂钩以显示/隐藏叠加层的事件。

更新

@Aristos的回答让我大部分都在那里。关键部分是处理PageRequestManager.endRequest以在AJAX调用完成时隐藏进度对话框。

有一种情况我仍有问题：如果提交按钮导致文件下载，我没有可用于隐藏进度对话框的事件。 This question有一个可以解决问题的答案，我会尝试一下。

Answer 1

您允许/不允许在标志上提交表单，如：

Page.Form.Attributes["onsubmit"] = "return fAllowToSubmit();";

当你通过updatepanel发送并等待返回时，你打开关闭提交的标志。

 <script type="text/javascript"> 
    var _fAllowToSubmit = true;
    // here you can throw and an alert() when _fAllowToSubmit==false
    function fAllowToSubmit() 
     {
        if(!_fAllowToSubmit)
          alert("Please wait for the page to be updated");

       return _fAllowToSubmit;
     }

    // to avoid calling it before the Sys loaded
    jQuery(document).ready(function() {
      var prm = Sys.WebForms.PageRequestManager.getInstance();    
       prm.add_initializeRequest(InitializeRequest);
       prm.add_endRequest(EndRequest);
    });

    function InitializeRequest(sender, args) {
       _fAllowToSubmit = false;
       // to make it even nicer you can place here a fade css class
       // it will auto-clear with the next update.
       jQuery("#YourWarpDiv").addClass("FadedDiv");
    }

    function EndRequest(sender, args) {
        _fAllowToSubmit = true;
    }
</script>

和

.FadedDiv
{
    background-color: white;
    filter:alpha(opacity=50);
    opacity: 0.5;
    -moz-opacity:0.50;
}

当然，您还可以使用更新面板自动打开“请稍候”消息。

如何防止在使用UpdatePanels的ASP.NET应用程序中使用jQuery进行双重提交

1 个答案: