Prevent Multiple Submitting in one button laravel

Question

Before i make this question i use javascript method to prevent multiple submit on my blade template. But i know it's client side that still possible to get attack by.

This is my javascript code

<script>
    function submitForm(btn) {
        // disable the button
        btn.disabled = true;
        // submit the form    
        btn.form.submit();
    }
</script>

<input id="submitButton" type="button" value="Submit" onclick="submitForm(this);" />

my question is, is there another way to prevent without client side in laravel?

AFAIK once you click the `Submit` button your data gets transferred to your server-side form handling script. So disabling the button can't stop a user from multiple submission. You need to follow some other logic to prevent it if you are looking for preventing duplicate entry. — NewBee, May 19 '18 at 04:00
If you need some heavy logic sounding this, that's fine, but there's nothing wrong with disabling the button. You could even replace the text in the button with some loading spinner. — parker_codes, May 19 '18 at 04:51
See [this](https://stackoverflow.com/questions/49454614/laravel-php-multiple-form-submissions-multiple-click-on-submit-button) — iamab.in, May 19 '18 at 08:36
@NewBee how can a casual user do multiple submissions if the submit button is disabled? — Adam, Jul 15 '18 at 09:55

score 12 · Answer 1 · edited Apr 12 '22 at 07:10

12

The most straightforward way to guarantee the uniqueness of a form submission (In the sense of stopping someone mashing submit twice) is to generate a random token and storing it in a session AND a hidden field.

If it doesn't match, reject the form, if it does match, accept the form and nuke the session key.

OR

Force Laravel to regenerate a new session token after each time a token is verified correctly. (Easy Way Out)

To achieve this, create a new function tokensMatch() in app/Http/Middleware/VerfiyCsrfToken.php (which will overwrite the inherited one). Something like this:

protected function tokensMatch($request)
{
    $tokensMatch = parent::tokensMatch($request);

    if ($tokensMatch) {
        $request->session()->regenerateToken();
    }

    return $tokensMatch;
}

In case you validate the form and the validation fails, the old data will be passed back to the form. So you need to make sure not to pass back the old token by adding _token to the $dontFlash array in app/Exceptions/Handler.php

protected $dontFlash = ['password', 'password_confirmation', '_token'];

edited Apr 12 '22 at 07:10

Top-Master

7,611
5
39
71

answered May 19 '18 at 04:41

Saurabh

2,655
1
20
47

thankyou for your comment but where is Request.php ? i don't see it under app/http ? – Abdan Syakuro May 19 '18 at 13:26
Sorry, it's in `app/Exceptions/Handler.php` I have edited my answer. – Saurabh May 19 '18 at 14:10
Method equals does not exist. ? – Abdan Syakuro May 19 '18 at 14:16
But it won't be work for ajax... Only for simple POST requests. – Vladimir Gonchar May 25 '19 at 10:45
What happens if a user opens up multiple browser tabs? Like say, an update page for 2 different resources. Wouldn't the second tab immediately invalidate the first tab's token? Or should token names be context-aware? – georaldc Nov 11 '19 at 21:07

score 3 · Answer 2 · answered Sep 30 '21 at 09:40

Step 1: write a class name in the form tag Exp: "from-prevent-multiple-submits"

<form class="pt-4 from-prevent-multiple-submits" action="{{ route('messages.store') }}" method="POST">
            @csrf

Step 2: Write a class in button section

 <button type="submit" id="submit" class="btn btn-primary from-prevent-multiple-submits">{{ translate('Send') }}</button>

Step 3: write this script code

<script type="text/javascript">
(function(){
$('.from-prevent-multiple-submits').on('submit', function(){
    $('.from-prevent-multiple-submits').attr('disabled','true');
})
})();
</script>

just like my comment on your same answer on the [other question](https://stackoverflow.com/questions/27682830/prevent-from-submiting-form-several-times-by-clicking-fast-in-laravel), I just want to testify that this solution works on me. if only stackoverflow will allow me to give you 1K credits, I will. `[1+]` — kapitan, Aug 09 '23 at 00:22

Sree Saradh · Answer 3 · 2022-08-19T06:45:28.373

1

give id to submit button

<input class="main-btn" id="register" type="submit" value="Make Appointment">

give id to form

 <form id="appointment_form" method="post" action="{{route('appointment')}}">

in your js add these

$('#appointment_form').on('submit', function () {
   $('#register').attr('disabled', 'true'); 
});

edited Aug 19 '22 at 06:45

answered Aug 19 '22 at 06:35

Sree Saradh

11
3

score 0 · Answer 4 · answered Feb 07 '23 at 02:47

Step 1: give id to form

<form action="{{ route('web.reports.store') }}" method="POST" enctype="multipart/form-data" id="kt_stepper_form">

Step 2: give id or add class to submit button

<button type="submit" class="btn btn-primary submit-btn" data-kt-stepper-action="submit">
    <span class="indicator-label">
        Submit
    </span>
    <span class="indicator-progress">
        Please wait... <span
            class="spinner-border spinner-border-sm align-middle ms-2"></span>
    </span>
</button>

Step 3: and then, you can add some jquery script like this

$('#kt_stepper_form').on('submit', function(){
    $('.submit-btn').attr('disabled', true);
    $('.indicator-label').hide();
    $('.indicator-progress').show();
});

with code above, button will be disabled and show indicator progress when user clicked the button

Prevent Multiple Submitting in one button laravel

4 Answers4

Linked