Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix loading button with invalid form #20754

Merged
merged 2 commits into from
Aug 11, 2022
Merged

Fix loading button with invalid form #20754

merged 2 commits into from
Aug 11, 2022

Conversation

silverwind
Copy link
Member

@silverwind silverwind commented Aug 10, 2022 •
edited
Loading

Previously, if a invalid form was submitted (for example issue with no title), the form could not be corrected and re-submitted again because the button stayed stuck in loading state. Fix that by hooking the 'submit' event instead which triggers only when the form is valid.

Related: #16157, also this resolves #16157 (comment)

@silverwind
Fix loading button with invalid form
1a63170 
Previously, if a invalid form was submitted (for example issue with no
title), the form could not be re-submitted again because the button
would not stay stuck in loading state. Fix that by hooking the 'submit'
event instead which triggers only when the form is valid.
@silverwind silverwind added type/bug topic/ui Change the appearance of the Gitea UI backport/v1.17 labels Aug 10, 2022
@GiteaBot GiteaBot added the lgtm/need 1 This PR needs approval from one additional maintainer to be merged. label Aug 10, 2022
delvh
delvh reviewed Aug 10, 2022
View reviewed changes
web_src/js/features/common-global.js
$btn.addClass('loading disabled');
// prevent multiple form submissions on forms containing .loading-button
document.addEventListener('submit', (e) => {
const btn = e.target.querySelector('.loading-button');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have the slight feeling that @wxiaoguang won't like this change as it mixes native DOM APIs with jQuery again.

Copy link
Member Author

@silverwind silverwind Aug 11, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry, but I'm not going to write jQuery just because it "fits" better. jQuery can go to hell if you ask me 😉.

Copy link
Contributor

@wxiaoguang wxiaoguang Aug 11, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am fine with it since it's a full function without other dependency.

I just have objection to something like el.setAttribute(...); $(el).attr(....) (mixed together in newly written code)

web_src/js/features/common-global.js
@@ -142,16 +142,12 @@ export function initGlobalCommon() {
}
});

// loading-button this logic used to prevent push one form more than one time
$(document).on('click', '.button.loading-button', function (e) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could this break <a>s with the button style class?
Links can't be submitted, right?
But is there even a link that satisfies alll these requirements?
I haven't found any with the loading-button class, but simple button links are common...
(Of course, that was only a small search I did...)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, <a> can not submit a form in HTML, only through JS would that be possible. Searching for loading-button in templates yields exactly 3 buttons that use this class, so I think we should keep the selector simple and independent of the Fomantic-specific .button class.

wxiaoguang
wxiaoguang approved these changes Aug 11, 2022
View reviewed changes
Copy link
Contributor

@wxiaoguang wxiaoguang left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a bug fix, it looks good to me.

@GiteaBot GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Aug 11, 2022
@wxiaoguang wxiaoguang merged commit 57f1ea0 into go-gitea:main Aug 11, 2022
@silverwind silverwind deleted the loading-btn branch August 11, 2022 06:11
silverwind added a commit to silverwind/gitea that referenced this pull request Aug 11, 2022
@silverwind @lunny
Fix loading button with invalid form (go-gitea#20754)
3995217 
Previously, if a invalid form was submitted (for example issue with no
title), the form could not be re-submitted again because the button
would not stay stuck in loading state. Fix that by hooking the 'submit'
event instead which triggers only when the form is valid.

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
@silverwind silverwind mentioned this pull request Aug 11, 2022
Merged
wxiaoguang pushed a commit that referenced this pull request Aug 11, 2022
@silverwind
Fix loading button with invalid form (#20754) (#20759)
d19c2c9 
Previously, if a invalid form was submitted (for example issue with no
title), the form could not be re-submitted again because the button
would not stay stuck in loading state. Fix that by hooking the 'submit'
event instead which triggers only when the form is valid.
@wxiaoguang wxiaoguang added the backport/done All backports for this PR have been created label Aug 11, 2022
zeripath added a commit to zeripath/gitea that referenced this pull request Aug 17, 2022
@zeripath
Changelog 1.17.1
db4ccde 
 ## [1.17.1](https://github.com/go-gitea/gitea/releases/tag/1.17.1) - 2022-08-17

* SECURITY
  * Correctly escape within tribute.js (go-gitea#20831) (go-gitea#20832)
* FEATURES
  * Add support for NuGet API keys (go-gitea#20721) (go-gitea#20734)
* ENHANCEMENTS
  * Display project in issue list (go-gitea#20583)
  * Add disable download source configuration (go-gitea#20548) (go-gitea#20579)
* BUGFIXES
  * Use the total issue count for UI (go-gitea#20785) (go-gitea#20827)
  * Add proxy host into allow list (go-gitea#20798) (go-gitea#20819)
  * Add missing translation for queue flush workers (go-gitea#20791) (go-gitea#20792)
  * Improve comment header for mobile (go-gitea#20781) (go-gitea#20789)
  * Fix git.Init for doctor sub-command (go-gitea#20782) (go-gitea#20783)
  * Check webhooks slice length before calling xorm (go-gitea#20642) (go-gitea#20768)
  * Remove manual rollback for failed generated repositories (go-gitea#20639) (go-gitea#20762)
  * Use correct field name in npm template (go-gitea#20675) (go-gitea#20760)
  * Keep download count on Container tag overwrite (go-gitea#20728) (go-gitea#20735)
  * Fix v220 migration to be compatible for MSSQL 2008 r2 (go-gitea#20702) (go-gitea#20707)
  * Use request timeout for git service rpc (go-gitea#20689) (go-gitea#20693)
  * Send correct NuGet status codes (go-gitea#20647) (go-gitea#20677)
  * Use correct context to get package content (go-gitea#20673) (go-gitea#20676)
  * Fix the JS error "EventSource is not defined" caused by some non-standard browsers (go-gitea#20584) (go-gitea#20663)
  * Add default commit messages to PR for squash merge (go-gitea#20618) (go-gitea#20645)
  * Fix package upload for files >32mb (go-gitea#20622) (go-gitea#20635)
  * Fix the new-line copy-paste for rendered code (go-gitea#20612)
  * Clean up and fix clone button script (go-gitea#20415 & go-gitea#20600) (go-gitea#20599)
  *  Fix default merge style (go-gitea#20564) (go-gitea#20565)
  * Add repository condition for issue count (go-gitea#20454) (go-gitea#20496)
* MISC
  * Make branch icon stand out more (go-gitea#20726) (go-gitea#20774)
  * Fix loading button with invalid form (go-gitea#20754) (go-gitea#20759)
  * Add username check to doctor (go-gitea#20140) (go-gitea#20671)
  * Enable Wire 2 for Internal SSH Server (go-gitea#20616) (go-gitea#20617)
  *  Fix SecToTime edge-cases (go-gitea#20610) (go-gitea#20611)

Signed-off-by: Andrew Thornton <art27@cantab.net>
@zeripath zeripath mentioned this pull request Aug 17, 2022
Merged
techknowlogick added a commit that referenced this pull request Aug 18, 2022
@zeripath @techknowlogick
@delvh @lafriks @lunny
Changelog 1.17.1 (#20833)
7374861 
* Changelog 1.17.1

 ## [1.17.1](https://github.com/go-gitea/gitea/releases/tag/1.17.1) - 2022-08-17

* SECURITY
  * Correctly escape within tribute.js (#20831) (#20832)
* FEATURES
  * Add support for NuGet API keys (#20721) (#20734)
* ENHANCEMENTS
  * Display project in issue list (#20583)
  * Add disable download source configuration (#20548) (#20579)
* BUGFIXES
  * Use the total issue count for UI (#20785) (#20827)
  * Add proxy host into allow list (#20798) (#20819)
  * Add missing translation for queue flush workers (#20791) (#20792)
  * Improve comment header for mobile (#20781) (#20789)
  * Fix git.Init for doctor sub-command (#20782) (#20783)
  * Check webhooks slice length before calling xorm (#20642) (#20768)
  * Remove manual rollback for failed generated repositories (#20639) (#20762)
  * Use correct field name in npm template (#20675) (#20760)
  * Keep download count on Container tag overwrite (#20728) (#20735)
  * Fix v220 migration to be compatible for MSSQL 2008 r2 (#20702) (#20707)
  * Use request timeout for git service rpc (#20689) (#20693)
  * Send correct NuGet status codes (#20647) (#20677)
  * Use correct context to get package content (#20673) (#20676)
  * Fix the JS error "EventSource is not defined" caused by some non-standard browsers (#20584) (#20663)
  * Add default commit messages to PR for squash merge (#20618) (#20645)
  * Fix package upload for files >32mb (#20622) (#20635)
  * Fix the new-line copy-paste for rendered code (#20612)
  * Clean up and fix clone button script (#20415 & #20600) (#20599)
  *  Fix default merge style (#20564) (#20565)
  * Add repository condition for issue count (#20454) (#20496)
* MISC
  * Make branch icon stand out more (#20726) (#20774)
  * Fix loading button with invalid form (#20754) (#20759)
  * Add username check to doctor (#20140) (#20671)
  * Enable Wire 2 for Internal SSH Server (#20616) (#20617)
  *  Fix SecToTime edge-cases (#20610) (#20611)

Signed-off-by: Andrew Thornton <art27@cantab.net>

* Apply suggestions from code review

Co-authored-by: John Olheiser <john+github@jolheiser.com>

* Update CHANGELOG.md

Co-authored-by: delvh <dev.lh@web.de>

* Update CHANGELOG.md

* Update CHANGELOG.md

* update changelog

* Update CHANGELOG.md

Co-authored-by: John Olheiser <john+github@jolheiser.com>

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: techknowlogick <matti@mdranta.net>
Co-authored-by: John Olheiser <john+github@jolheiser.com>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: Lauris BH <lauris@nix.lv>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
jolheiser pushed a commit to jolheiser/gitea that referenced this pull request Aug 22, 2022
@zeripath @techknowlogick
@delvh @lafriks @lunny @jolheiser
Changelog 1.17.1 (go-gitea#20833)
67738a0 
* Changelog 1.17.1

 ## [1.17.1](https://github.com/go-gitea/gitea/releases/tag/1.17.1) - 2022-08-17

* SECURITY
  * Correctly escape within tribute.js (go-gitea#20831) (go-gitea#20832)
* FEATURES
  * Add support for NuGet API keys (go-gitea#20721) (go-gitea#20734)
* ENHANCEMENTS
  * Display project in issue list (go-gitea#20583)
  * Add disable download source configuration (go-gitea#20548) (go-gitea#20579)
* BUGFIXES
  * Use the total issue count for UI (go-gitea#20785) (go-gitea#20827)
  * Add proxy host into allow list (go-gitea#20798) (go-gitea#20819)
  * Add missing translation for queue flush workers (go-gitea#20791) (go-gitea#20792)
  * Improve comment header for mobile (go-gitea#20781) (go-gitea#20789)
  * Fix git.Init for doctor sub-command (go-gitea#20782) (go-gitea#20783)
  * Check webhooks slice length before calling xorm (go-gitea#20642) (go-gitea#20768)
  * Remove manual rollback for failed generated repositories (go-gitea#20639) (go-gitea#20762)
  * Use correct field name in npm template (go-gitea#20675) (go-gitea#20760)
  * Keep download count on Container tag overwrite (go-gitea#20728) (go-gitea#20735)
  * Fix v220 migration to be compatible for MSSQL 2008 r2 (go-gitea#20702) (go-gitea#20707)
  * Use request timeout for git service rpc (go-gitea#20689) (go-gitea#20693)
  * Send correct NuGet status codes (go-gitea#20647) (go-gitea#20677)
  * Use correct context to get package content (go-gitea#20673) (go-gitea#20676)
  * Fix the JS error "EventSource is not defined" caused by some non-standard browsers (go-gitea#20584) (go-gitea#20663)
  * Add default commit messages to PR for squash merge (go-gitea#20618) (go-gitea#20645)
  * Fix package upload for files >32mb (go-gitea#20622) (go-gitea#20635)
  * Fix the new-line copy-paste for rendered code (go-gitea#20612)
  * Clean up and fix clone button script (go-gitea#20415 & go-gitea#20600) (go-gitea#20599)
  *  Fix default merge style (go-gitea#20564) (go-gitea#20565)
  * Add repository condition for issue count (go-gitea#20454) (go-gitea#20496)
* MISC
  * Make branch icon stand out more (go-gitea#20726) (go-gitea#20774)
  * Fix loading button with invalid form (go-gitea#20754) (go-gitea#20759)
  * Add username check to doctor (go-gitea#20140) (go-gitea#20671)
  * Enable Wire 2 for Internal SSH Server (go-gitea#20616) (go-gitea#20617)
  *  Fix SecToTime edge-cases (go-gitea#20610) (go-gitea#20611)

Signed-off-by: Andrew Thornton <art27@cantab.net>

* Apply suggestions from code review

Co-authored-by: John Olheiser <john+github@jolheiser.com>

* Update CHANGELOG.md

Co-authored-by: delvh <dev.lh@web.de>

* Update CHANGELOG.md

* Update CHANGELOG.md

* update changelog

* Update CHANGELOG.md

Co-authored-by: John Olheiser <john+github@jolheiser.com>

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: techknowlogick <matti@mdranta.net>
Co-authored-by: John Olheiser <john+github@jolheiser.com>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: Lauris BH <lauris@nix.lv>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
lunny added a commit that referenced this pull request Aug 23, 2022
@jolheiser @zeripath
@techknowlogick @delvh @lafriks @lunny
Changelog 1.17.1 (#20833) (#20919)
fa8fc5d 
* Changelog 1.17.1 (#20833)

* Changelog 1.17.1

 ## [1.17.1](https://github.com/go-gitea/gitea/releases/tag/1.17.1) - 2022-08-17

* SECURITY
  * Correctly escape within tribute.js (#20831) (#20832)
* FEATURES
  * Add support for NuGet API keys (#20721) (#20734)
* ENHANCEMENTS
  * Display project in issue list (#20583)
  * Add disable download source configuration (#20548) (#20579)
* BUGFIXES
  * Use the total issue count for UI (#20785) (#20827)
  * Add proxy host into allow list (#20798) (#20819)
  * Add missing translation for queue flush workers (#20791) (#20792)
  * Improve comment header for mobile (#20781) (#20789)
  * Fix git.Init for doctor sub-command (#20782) (#20783)
  * Check webhooks slice length before calling xorm (#20642) (#20768)
  * Remove manual rollback for failed generated repositories (#20639) (#20762)
  * Use correct field name in npm template (#20675) (#20760)
  * Keep download count on Container tag overwrite (#20728) (#20735)
  * Fix v220 migration to be compatible for MSSQL 2008 r2 (#20702) (#20707)
  * Use request timeout for git service rpc (#20689) (#20693)
  * Send correct NuGet status codes (#20647) (#20677)
  * Use correct context to get package content (#20673) (#20676)
  * Fix the JS error "EventSource is not defined" caused by some non-standard browsers (#20584) (#20663)
  * Add default commit messages to PR for squash merge (#20618) (#20645)
  * Fix package upload for files >32mb (#20622) (#20635)
  * Fix the new-line copy-paste for rendered code (#20612)
  * Clean up and fix clone button script (#20415 & #20600) (#20599)
  *  Fix default merge style (#20564) (#20565)
  * Add repository condition for issue count (#20454) (#20496)
* MISC
  * Make branch icon stand out more (#20726) (#20774)
  * Fix loading button with invalid form (#20754) (#20759)
  * Add username check to doctor (#20140) (#20671)
  * Enable Wire 2 for Internal SSH Server (#20616) (#20617)
  *  Fix SecToTime edge-cases (#20610) (#20611)

Signed-off-by: Andrew Thornton <art27@cantab.net>

* Apply suggestions from code review

Co-authored-by: John Olheiser <john+github@jolheiser.com>

* Update CHANGELOG.md

Co-authored-by: delvh <dev.lh@web.de>

* Update CHANGELOG.md

* Update CHANGELOG.md

* update changelog

* Update CHANGELOG.md

Co-authored-by: John Olheiser <john+github@jolheiser.com>

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: techknowlogick <matti@mdranta.net>
Co-authored-by: John Olheiser <john+github@jolheiser.com>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: Lauris BH <lauris@nix.lv>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>

* update changelog

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <matti@mdranta.net>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: Lauris BH <lauris@nix.lv>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
vsysoev pushed a commit to IntegraSDL/gitea that referenced this pull request Aug 28, 2022
@silverwind @lunny
Fix loading button with invalid form (go-gitea#20754)
f455968 
Previously, if a invalid form was submitted (for example issue with no
title), the form could not be re-submitted again because the button
would not stay stuck in loading state. Fix that by hooking the 'submit'
event instead which triggers only when the form is valid.

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
vsysoev pushed a commit to IntegraSDL/gitea that referenced this pull request Aug 28, 2022
@jolheiser @zeripath
@techknowlogick @delvh @lafriks @lunny
Changelog 1.17.1 (go-gitea#20833) (go-gitea#20919)
8bdf690 
* Changelog 1.17.1 (go-gitea#20833)

* Changelog 1.17.1

 ## [1.17.1](https://github.com/go-gitea/gitea/releases/tag/1.17.1) - 2022-08-17

* SECURITY
  * Correctly escape within tribute.js (go-gitea#20831) (go-gitea#20832)
* FEATURES
  * Add support for NuGet API keys (go-gitea#20721) (go-gitea#20734)
* ENHANCEMENTS
  * Display project in issue list (go-gitea#20583)
  * Add disable download source configuration (go-gitea#20548) (go-gitea#20579)
* BUGFIXES
  * Use the total issue count for UI (go-gitea#20785) (go-gitea#20827)
  * Add proxy host into allow list (go-gitea#20798) (go-gitea#20819)
  * Add missing translation for queue flush workers (go-gitea#20791) (go-gitea#20792)
  * Improve comment header for mobile (go-gitea#20781) (go-gitea#20789)
  * Fix git.Init for doctor sub-command (go-gitea#20782) (go-gitea#20783)
  * Check webhooks slice length before calling xorm (go-gitea#20642) (go-gitea#20768)
  * Remove manual rollback for failed generated repositories (go-gitea#20639) (go-gitea#20762)
  * Use correct field name in npm template (go-gitea#20675) (go-gitea#20760)
  * Keep download count on Container tag overwrite (go-gitea#20728) (go-gitea#20735)
  * Fix v220 migration to be compatible for MSSQL 2008 r2 (go-gitea#20702) (go-gitea#20707)
  * Use request timeout for git service rpc (go-gitea#20689) (go-gitea#20693)
  * Send correct NuGet status codes (go-gitea#20647) (go-gitea#20677)
  * Use correct context to get package content (go-gitea#20673) (go-gitea#20676)
  * Fix the JS error "EventSource is not defined" caused by some non-standard browsers (go-gitea#20584) (go-gitea#20663)
  * Add default commit messages to PR for squash merge (go-gitea#20618) (go-gitea#20645)
  * Fix package upload for files >32mb (go-gitea#20622) (go-gitea#20635)
  * Fix the new-line copy-paste for rendered code (go-gitea#20612)
  * Clean up and fix clone button script (go-gitea#20415 & go-gitea#20600) (go-gitea#20599)
  *  Fix default merge style (go-gitea#20564) (go-gitea#20565)
  * Add repository condition for issue count (go-gitea#20454) (go-gitea#20496)
* MISC
  * Make branch icon stand out more (go-gitea#20726) (go-gitea#20774)
  * Fix loading button with invalid form (go-gitea#20754) (go-gitea#20759)
  * Add username check to doctor (go-gitea#20140) (go-gitea#20671)
  * Enable Wire 2 for Internal SSH Server (go-gitea#20616) (go-gitea#20617)
  *  Fix SecToTime edge-cases (go-gitea#20610) (go-gitea#20611)

Signed-off-by: Andrew Thornton <art27@cantab.net>

* Apply suggestions from code review

Co-authored-by: John Olheiser <john+github@jolheiser.com>

* Update CHANGELOG.md

Co-authored-by: delvh <dev.lh@web.de>

* Update CHANGELOG.md

* Update CHANGELOG.md

* update changelog

* Update CHANGELOG.md

Co-authored-by: John Olheiser <john+github@jolheiser.com>

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: techknowlogick <matti@mdranta.net>
Co-authored-by: John Olheiser <john+github@jolheiser.com>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: Lauris BH <lauris@nix.lv>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>

* update changelog

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <matti@mdranta.net>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: Lauris BH <lauris@nix.lv>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
@wxiaoguang wxiaoguang added this to the 1.18.0 milestone Oct 7, 2022
@go-gitea go-gitea locked and limited conversation to collaborators May 3, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@delvh delvh delvh left review comments

@wxiaoguang wxiaoguang wxiaoguang approved these changes

@lafriks lafriks lafriks approved these changes

Assignees
No one assigned
Labels
backport/done All backports for this PR have been created lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. topic/ui Change the appearance of the Gitea UI type/bug
Projects
None yet
Milestone
1.18.0
Development

Successfully merging this pull request may close these issues.
6 participants
@silverwind @lafriks @wxiaoguang @delvh @GiteaBot @lunny