禁用提交按钮会阻止表单提交 PHP/Javascript [英] Disabling submit button stops form from being submitted PHP / Javascript

问题描述

我想我遇到了一个经典问题，但到目前为止我还没有找到可行的解决方案.

我有一个表单，用户点击发送"，一切正常，使用 PRG 模式并进行客户端和服务器端验证.

当任何用户(假设他输入了有效的输入)在服务器脚本结束执行之前快速点击了多次...

我没有收到任何重复的条目，因为我已经处理过了，但是浏览器没有进入我的感谢提交页面".相反，它使用相同的值重新提交同一页面，我得到的是我设置的自定义错误，以警告用户他正在尝试输入已存储在数据库中的详细信息.最初发送的详细信息都在数据库中，但用户没有机会知道.

我尝试使用 jQuery 在提交事件上禁用提交按钮，但在这种情况下，数据未提交.

HTML

 
<input id="send-emails" type="submit" name="send_emails" value="Send"/>

jQuery

 $(document).ready(function(){$('#mail-form').submit(function(){$('#send-emails').attr('disabled','disabled');});});

我想知道是否可以在禁用按钮后使用 Javascript 强制提交，以及如何处理禁用 Javascript 的 UA

提前致谢

解决方案

我认为这意味着您要依赖提交按钮的值来为请求提供服务?那是你在检查

$_REQUEST['send_emails'] == 'Send';

这不是一个好习惯.您永远不应该依赖提交按钮的值，因为这正是向用户显示的内容.相反，您应该添加一个包含要触发的事件的隐藏输入.表单提交后，你不需要关心提交按钮的值是什么，你可以禁用它.表单中的所有其他非禁用数据仍会提交.

禁用按钮后确实可以强制提交.

$(function () {$("#mail-form").submit(function () {$("#send-emails").attr('disabled', 'disabled');window.location = '?'+ $("#mail-form").serialize() + '&send_mails=Send';返回假；});});

服务器端设置了一个 $_SESSION 变量，用于跟踪他们上次提交的时间并在一定时间内阻止提交.

I think I got a classic problem but I was not able to find a working solution so far.

I have got a form , the user clicks "Send" and everything works fine using a PRG pattern and doing both client-side and server-side validation.

The problem arises when any user (let's assume he entered valid inputs) clicks more then once quickly before the server script ends its execution...

I do not get any duplicated entry because I took care of that but the browser does not go to my "thanks for submitting page". Instead it re-submits the same page with the same values and what I get are the custom errors I set to warn the user he is trying to enter details already stored in the database. The details sent in the first place are all in the database but the user has no chance to know that.

I tried to disable the submit button on a submit event using jQuery but in that case the data are not submitted.

HTML

   <div id="send-button-container">
   <input id="send-emails" type="submit" name="send_emails" value="Send"/>
   </div>

jQuery

   $(document).ready(function(){

        $('#mail-form').submit(function(){
        $('#send-emails').attr('disabled','disabled');
        });
   });

I am wondering if I can force a submission using Javascript after disabling the button and also how to deal with UAs with Javascript disabled

Thanks in advance

解决方案

I assume this means you are depending on the value of the submit button to service the request? That is you are checking

$_REQUEST['send_emails'] == 'Send';

This is not good practice. You should never depend on the value of the submit button because that is the just what is displayed to the user. Instead, you should add a hidden input that contains the event you want to fire. After the form is submitted, you don't need to care what the value of the submit button is and you can disable it. All other non-disabled data in the form is still submitted.

You can indeed force the submission after disabling the button.

$(function () {
   $("#mail-form").submit(function () {
      $("#send-emails").attr('disabled', 'disabled');
      window.location = '?' + $("#mail-form").serialize() + '&send_mails=Send';
      return false;
   });
});

Server side set a $_SESSION variable that keeps track of the last time they made a submission and block submissions within a certain time.

<?php
session_start();
if (isset($_REQUEST['send_emails'])) {
   if (isset($_SESSION['mail_sent'])
   && strtotime($_SESSION['mail_sent']) < strtotime('5 seconds ago')
   ) {
      redirect_to_thanks();
   }
   do_post();
}

function do_post() {
   if (do_validate()) {
      $_SESSION['mail_sent'] = time();
      redirect_to_thanks();
   }
   else {
      yell_at_user_a_lot();
   }
}
?>

这篇关于禁用提交按钮会阻止表单提交 PHP/Javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！