filamentphp / filament

A collection of beautiful full-stack components for Laravel. The perfect starting point for your next app. Using Livewire, Alpine.js and Tailwind CSS.
https://filamentphp.com
MIT License
17.67k stars 2.77k forks source link

The same form is submitted multiple times #10112

Open wily45454545 opened 9 months ago

wily45454545 commented 9 months ago

Package

filament/filament

Package Version

v3.1.12

Laravel Version

v10.35.0

Livewire Version

v3.2.6

PHP Version

PHP 8.2.0

Problem description

When creating a record, clicking the Create button continuously will cause the form to be submitted repeatedly.

Expected behavior

Button keeps display loading animation and disable button until page redirects

Steps to reproduce

https://demo.filamentphp.com/blog/posts/create Clicking the Create button continuously.

Reproduction repository

https://github.com/filamentphp/demo

Relevant log output

No response

Donate 💰 to fund this issue

Fund with Polar

danharrin commented 9 months ago

Cannot reproduce. I am continuously clicking the create button and no requests are made.

https://github.com/filamentphp/filament/assets/41773797/5d93bf38-d26f-4b81-ae4d-4c132228234f

shabxs commented 5 months ago

Multiple clicking on the submit button creates duplicates entry. I think this is a serious issue still exist on the latest version...

danharrin commented 5 months ago

Please show me how to reproduce it, check the video above

shabxs commented 5 months ago

This video shows regular click and multiple clicks.

https://github.com/filamentphp/filament/assets/14359417/35dec8f6-fd41-42ac-abd3-71f9d8418430

Arsham-rmz commented 4 months ago

i have this problem too, this happen in slow network , when form submit take long

yesterselga commented 2 months ago

same issue here, some of my users can still click submit button after loading state, before the page refresh on slow network. I have to manually correct double entries for money transactions :D still waiting for fix :)

danharrin commented 2 months ago

The only reproduction repo that has been posted is the demo, in which I cannot reproduce the problem. This will remain closed until someone posts a new repo that works to reproduce the problem

ramimarashdeh1995 commented 4 weeks ago

You have to add this function on class CreateClass, until this issue fixed

public function beforeCreate(){
$this->data = null;
}
ahmadaldabouqii commented 4 weeks ago

You have to add this function on class CreateClass, until this issue fixed

public function beforeCreate(){
$this->data = null;
}

@ramimarashdeh1995

Thank you rami, it worked for me

shabxs commented 4 weeks ago

You have to add this function on class CreateClass, until this issue fixed

public function beforeCreate(){
$this->data = null;
}

Thats Beautiful and Thank You

danharrin commented 3 weeks ago

What OS and browser are you all using? I still cant get it to submit multiple times

ahmadaldabouqii commented 3 weeks ago

@danharrin Fix this issue and ping us please !

danharrin commented 3 weeks ago

@danharrin Fix this issue and ping us please !

dude... are you not reading what I am writing?

ahmadaldabouqii commented 3 weeks ago

@danharrin

Yup, we are using chrome last version and linux OS

danharrin commented 3 weeks ago

@ramimarashdeh1995 @shabxs @yesterselga @Arsham-rmz what OS are you using, I don't have Linux to test on

ahmadaldabouqii commented 3 weeks ago

@danharrin Rami has windows 11

ramimarashdeh1995 commented 3 weeks ago

@ramimarashdeh1995 @shabxs @yesterselga @Arsham-rmz what OS are you using, I don't have Linux to test on

I used windows 11 and chrome browser

danharrin commented 3 weeks ago

I can now get it to happen on Windows, but only if I throttle the network. A request is able to sneak through when the Livewire response arrives but before Livewire redirects the user to the next page. It seems like an bug in Livewire but it might be something we can work around within Filament.

shabxs commented 3 weeks ago

I can now get it to happen on Windows, but only if I throttle the network. A request is able to sneak through when the Livewire response arrives but before Livewire redirects the user to the next page. It seems like an bug in Livewire but it might be something we can work around within Filament.

What I understand is it's not a filament issue, neither livewire. Same issue occurs with regular submit actions on plain blade, including nova which is on vuejs.

As @danharrin mentioned a workaround fix on filament future releases would be great. Thanks in advance.

vbezruchkin commented 1 week ago

Hello guys, just a confirmation that we have the same issue. Just one more stress the issue really exists.

Thanks for your work.