Stop multiple submits for a html from

后端未结

关注

 2  444

So I\'ve google this problem, they all give the same code but it never works. I want to be able to only click on the button once so you can\'t spam click the button sending the

相关标签:

2条回答

北海茫月

2021-01-29 11:17

You would need to make one of your required inputs enable the submit button - it arrives disabled - set by the init() function. I have done it for a textbox here to illustrate.

You will need to set a value in your JavaScript for $hidden_input when the textbox is typed into - it should be 0 when the page loads but be set to 1 when it is ready to submit. You could set it up in different ways with the value being set in PHP as well. That depends exactly how you want it to perform.

You should also set your form action to <?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>.

<?php   
if (isset($_POST['hidden_input'])) $hidden_input = intval($_POST['hidden_input']);

$submit_count_input = intval($_POST['submit_count_input']);

if ($hidden_input == 1){
// do your processing here
$hidden_input = 2;
echo "Thank you. Form processed";
}else{
$hidden_input = 1;
echo "Form not processed.";
}    
// remove this section - just for testing
echo " Control Token: " . $hidden_input . " ";
echo " Submit Count: " . $submit_count_input; // to show it submits but does not process form
$submit_count_input++; 
?>
<!DOCTYPE html>
  <html>
    <head>
    <script language="javascript">
    function init(){
    if (document.getElementById('hidden_input').value == 2){
    document.getElementById('sbutton').value = "   Submitted   ";
    }else{
    document.getElementById('sbutton').value = "   Submit  ";
    }
    document.getElementById('sbutton').disabled = true;
    }
    function enable_it(){
    // could reset it here but you will be able to submit again
    //document.getElementById('hidden_input').value = 1;
    document.getElementById('sbutton').disabled = false;
    document.getElementById('sbutton').value = "   Submit  ";
    }
    function submit_this(){
    document.form.submit();
    }
    </script>
    </head>
    <body onload="init()">

      <form name="form" id="form" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']) ?>" method="post">
      <input type="text" name="text_box" onKeyPress="enable_it();" required />

      <input type="hidden" name="hidden_input" id="hidden_input" value="<?php echo $hidden_input ?>" />
      <input type="hidden" name="submit_count_input" id="submit_count_input" value="<?php echo $submit_count_input ?>" />

      <input type="button" name="sbutton" id="sbutton" value="" onclick="submit_this();" />
      </form>
      <a href="<?php echo htmlspecialchars($_SERVER['REQUEST_URI']); ?>">Click to start a new submission</a>

    </body>
   </html>

You can use the value from the hidden input to block future submission -

 if (intval($_POST['hidden_input']) == 1){
  // skip your signup code
 }

Bear in mind that this page is mostly dependent on JavaScript - just in case that may be an issue for those who don't like JavaScript dependency.

0 讨论(0)

忘掉有多难

2021-01-29 11:24
If I understood you correctly, you should try the following:

Instead of using inline javascript, I gave the submit input an id and use this javascript code:
```
var form = document.getElementById('sign'),
    submit = document.getElementById('submit');

submit.onclick = function() {
    submit.value='Submitting ..';
    form.submit();
};
```
https://jsfiddle.net/5kn2L7m9/3/

I also removed the .disabled = true because I think that's why the form wasn't submitting at all before. You should maybe do it by adding a class and removing the onclick event listener or check in the javascript if the form has been already sent.
0 讨论(0)
发布评论:

提交评论
- 加载中...