0

表单包含发送 POST 请求的显示 PDF 按钮。Content-disposition: inline此发布请求显示使用或Content-disposition: attachmenthttp 标头的 pdf 文件。

在 Chrome 中，双击此按钮会导致控制器出现异常，可能是因为请求同时执行了两次。

如何防止这种情况，以便双击提交按钮只执行一次请求？

环境：ASP .NET MVC2 或 Mono、jquery、jquery ui。

<form id="_form" method='post' target='_blank' action=''>
  .. form fields and other submit buttons
  <a href='#' id='_savepdf'>Show PDF</a>
</form>
<script type="text/javascript">
$(function () {
    $('#_savepdf').button();
    $('#_savepdf').click(function () { 
      $('#_form')[0].action= '/GetPDF'; 
      $('#_form')[0].submit(); 
     });
  });
</script>

更新

用户可能想要关闭 pdf 文件并再次单击或双击此按钮。仅应禁用来自相同用户的并发控制器执行。如果控制器已完成，按钮可以再次单击。

4

2 回答 2

0

使用e.preventDefault()：

$(function () {
    $('#_savepdf').button();
    $('#_savepdf').click(function (e) {  // <---- Don't forget e
      e.preventDefault();    // <------ HERE
      $('#_form')[0].action= '/GetPDF'; 
      $('#_form')[0].submit(); 
     });
});

编辑：第一次没有仔细阅读这个问题，我错过了关于双击的部分。为了防止双击执行任何操作，可以尝试向链接添加数据属性：

<a href='#' id='_savepdf' data-clicked='false'>Show PDF</a>

然后你可以在你的方法中检查并设置它：

$(function () {
    $('#_savepdf').button();
    $('#_savepdf').click(function () {
        var clickSent = $(this).data('clicked');

        if (clickSent == 'false') {
            $('#_form')[0].action= '/GetPDF'; 
            $('#_form')[0].submit(); 
        }
        $(this).data('clicked', 'true');
     });
});

这应该允许在您单击链接后设置属性，并且第二次单击应该跳过提交逻辑。

于 2013-01-04T21:17:31.817 回答
0

您可以在单击后禁用该按钮，这样用户就不能多次单击。

$('#_savepdf').button().click(function () { 
   $(this).button({disabled: true});
   $('#_form')[0].action= '/GetPDF'; 
   $('#_form')[0].submit(); 
});
于 2013-01-04T21:25:22.980 回答