Accessibility: Taxonomy: When a new category or tag is being added, show a spinner and noop the button to avoid multiple requests.

Props andg, afercia, guddu1315, SergeyBiryukov.
Fixes #47607.

git-svn-id: https://develop.svn.wordpress.org/trunk@45683 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Sergey Biryukov 2019-07-26 17:45:21 +00:00
parent 7493196625
commit 5618dfc6d3
3 changed files with 24 additions and 3 deletions

View File

@ -11,6 +11,8 @@
jQuery(document).ready(function($) { jQuery(document).ready(function($) {
var addingTerm = false;
/** /**
* Adds an event handler to the delete term link on the term overview page. * Adds an event handler to the delete term link on the term overview page.
* *
@ -102,6 +104,14 @@ jQuery(document).ready(function($) {
if ( ! validateForm( form ) ) if ( ! validateForm( form ) )
return false; return false;
if ( addingTerm ) {
// If we're adding a term, noop the button to avoid duplicate requests.
return false;
}
addingTerm = true;
form.find( '.submit .spinner' ).addClass( 'is-active' );
/** /**
* Does a request to the server to add a new term to the database * Does a request to the server to add a new term to the database
* *
@ -112,6 +122,9 @@ jQuery(document).ready(function($) {
$.post(ajaxurl, $('#addtag').serialize(), function(r){ $.post(ajaxurl, $('#addtag').serialize(), function(r){
var res, parent, term, indent, i; var res, parent, term, indent, i;
addingTerm = false;
form.find( '.submit .spinner' ).removeClass( 'is-active' );
$('#ajax-response').empty(); $('#ajax-response').empty();
res = wpAjax.parseAjaxResponse( r, 'ajax-response' ); res = wpAjax.parseAjaxResponse( r, 'ajax-response' );
if ( ! res || res.errors ) if ( ! res || res.errors )

View File

@ -1163,6 +1163,11 @@ p.popular-tags a {
text-decoration: underline; text-decoration: underline;
} }
#addtag .spinner {
float: none;
vertical-align: top;
}
#edittag { #edittag {
max-width: 800px; max-width: 800px;
} }

View File

@ -515,9 +515,12 @@ if ( $can_edit_terms ) {
* @param string $taxonomy The taxonomy slug. * @param string $taxonomy The taxonomy slug.
*/ */
do_action( "{$taxonomy}_add_form_fields", $taxonomy ); do_action( "{$taxonomy}_add_form_fields", $taxonomy );
?>
submit_button( $tax->labels->add_new_item ); <p class="submit">
<?php submit_button( $tax->labels->add_new_item, 'primary', 'submit', false ); ?>
<span class="spinner"></span>
</p>
<?php
if ( 'category' == $taxonomy ) { if ( 'category' == $taxonomy ) {
/** /**
* Fires at the end of the Edit Category form. * Fires at the end of the Edit Category form.